I'm trying to build a simple GAE application that would read a textbox, pass its contents to a Java method, and write its results to a specific DIV.
I know the very basics of HTML and web concepts (CSS, DOM etc.), but I lack practical experience in this field.
How do I hook up the text field to the input of the method, and the DIV to its output?
Basically you need to create an ajax request to the server passing the contents of the textbox as a parameter and returning the results, and then when you get the results set the contents of the div to what was returned.
look at the jquery.get() method for the client side code. You'll need to define the success method as a function which will set the contents of the div with the returned data. something along these lines:
$.get(insert_url_to_call_here,{ textBoxData: text_box_value }, function(data){
$(insert_selector_of_div_here).html(data);
});
you don't say what technology you are using server side, but basically you need the url you hit to return the data you need, and this should append whatever is returned to the div, so returning a html fragment should be what you want to do.
Related
I have a jsp page that calls a servlet when a drop down list with a bunch of different form names. If the user chooses to generate all forms the servlet then calls a java file that contains a loop. that runs each report generation one at a time. The whole process for this takes about 7 minutes as these are very large reports.
My question is, with keeping the same process (jsp -> servlet -> java code), can I get the progress status using ajax? What I want to do is find out what iteration the loop is on, find out if the function that writes the data out to excel (which is the format of all forms) has started, and write this information to the screen for the user to see so they are not guessing what is happening at any given time.
Additionally, we currently print out all this information to the console in eclipse so that for testing we can atleast know it is working. I am not sure if that matters.
Edit: I can provide code if needed but really the jsp contains a drop down list, the servlet takes that list and gets the value of the option selected (aka report1, report2, report 20...) and sends that value to the java code as a string. The java fucntion that is called is ReportAutomator.start(String reportNum){for loop here}. The for loop calls various functions to generate a report object which is forwarded onto a new java file that does more processing and then again forwarded to a final java file that unpacks the object and writes all the information to excel.
I am not really able to provide the actual code but I can try and make a dummy example if necessary. Sorry, and thank you for the help.
Determining the progress of a particular task is a surprisingly complicated thing once you get into the details however there is a jquery with ajax to update progress bar.
For a web app i recommend AJAX route it is suitable to indicate to the user the something is happening. Just have a spinner of some sort made visible when the page is submitted, and then hidden again when it is rendered
I am new in servlets, I would like to display results in the very same page that I am on when I click a search button, then the results should be on the very same page, how can I achieve that without going to another JSP or if I am supposed to do it behind the scene moving to another without the user noticing that its another page, how do I make it seem as if its the same page with results on it. Any shed of light is highly appreciated.
You have to use javascript to receive the search results from the server. This technique is called ajax. Javascript libraries like jquery (or many others) can help you a lot with this.
Your form submits the search term to the current page, i.e. you can leave the form action attribute empty.
In your servlet check whether a search term has been submitted. If this is the case, execute your search function and write the result to the response.
You don't mention where you data is coming from, but that is fairly unimportant in this question. The data could come from a local variable, from DOM storage or have been served to you using AJAX. But here is an example of setting text data in a textarea element (there are nearly unlimited ways to format what you want, this is one example only). Dynamically changing your current page in this manner means that you do not need to navigate to another.
It works by getting a reference to the element by it's name ("data" in this case) using document.getElementById
We then set the element's content value to your data, and it is displayed in the textarea.
HTML
<input type="text"></input>
<div>
<textarea id="data"></textarea>
</div>
Javascript
var data = "Here is your data that was returned from your source";
document.getElementById("data").value = data;
On jsfiddle
I have a PHP page that grabs a variable via GET and then pulls in some information from a database based on that variable. Once finished with the server-side stuff, there is some javascript that runs and takes the data supplied and creates a .png image using a 3rd party API and then saves that image to my server using an AJAX POST call to another PHP page.
That all works fine, but what I'd like to do now is automate some calls to that PHP page. Namely, say I have 100 such variables to go through, I want to, preferably in Java with a for loop, call that PHP page with each variable in turn.
The problem is that client-side javascript. It won't execute with the simple URLConnection in Java. It seems like I need some sort of browser replicator or some way to have java act like it's calling the PHP in a browser?
Alternatively, I could make do with having a third PHP page act in place of the Java as the controller, but I'm faced with the same problem of getting the javascript to execute.
Am I missing something easy? Is this set up not possible? I'd really prefer to do it in Java if possible to fold it into other code I already have running.
Let me try to add some more specifics without bogging it down too much. There's a PHP file getData.php that takes in an ID number via GET. So I call it like ./getData.php?id=someId
That PHP file takes the ID, goes to my DB and retrieves some data and pastes it into the HTML source. Then once the page is finished, I have some javascript within getData.php that retrieves that data, formats it into a DataTable and passes it off to Google Visualization API in order to make a SVG chart.
Then I have more JS that runs that takes that SVG object, turns it into a Canvas object, grabs the base64 image data from it and finally POSTs to saveTo.php with the following array:
{'id' : id, 'data' : imgData}
saveTo.php simply takes in that POST data, creates a file on my server based on id and pastes the imgData into it. The end result is that I can pass in an ID to getData.php and end up with saved image of a Visualization chart that I want made based on data in my DB tied to that ID.
That all works by hand. But I have ~1,000 of these IDs and I'd like to have it so this whole process is run each morning so that I can have updated images based on yesterday's data.
I should mention that I did try using the 3rd party toolkit HtmlUnit (http://htmlunit.sourceforge.net/) but just keep getting these errors:
com.gargoylesoftware.htmlunit.IncorrectnessListenerImpl notify
WARNING: Obsolete content type encountered: 'text/javascript'.
Some more searching around and hitting upon the right keywords to try finally led me to Selenium, which is exactly what I was looking for.
http://docs.seleniumhq.org/projects/webdriver/
I have a array of data which was generated due to some Actions in my previous actions
On submitting that page, Control will be redirecting to the second page,
IN the second page, I need to populate the array data into the Tables
( I want to use Javascript to populate this, No other means)
Problems which i am facing now
1) I cant read the Java array in the Java script ? (I am not sure how to pass the Java array to Javascript function)
2) Thought of implementing the Java script objects similar to the java objects, but there will be lot of over head
Can any one help me to over come this situation
I am using the BTT framework which is similar to Struts, for Javascript I am not using any frameworks
Thanks in advance
JSON would be a format to make the java-array accessible in javascript.
https://github.com/douglascrockford/JSON-java/blob/master/JSONStringer.java
too broad to answer, since specifics are missing. here are some generic steps.
Collect your stuff in JavaScript array
Have a hidden form field
while posting to server, set the value of hidden field to your array (in string format)
Read the hidden field content in server (posted form data)
Parse them (JSON is appropriate here)
Use them while preparing next page content as JS Array
I want to open a new browser and load a page from the file system (which will be created on clicking that button). My app is a java servlet. Basically I am allowing users to change some HTML on their website. On clicking the button the user get's to see a preview page, that shows what the page looks like with the changes made.
What would be the easiest way to do this and what issues can you see, and possibly how we would we get around them.
I see an issue, for example, if the browser window tries to open the file immediately, it won't even exist. So there needs to perhaps be some delay before trying to read the file.
This can be done using java script
window.open('url','name',....)
you can pass parameters in this function.
google for "javascript window.open function"
Cheers
Maybe you can use jQuery/AJAX or a similar technique to post the data to the server first and then open it in a new window.
see the jQuery documentation for an example: jQuery Post Example
if there is not much data to pass for preview page, you may pass it as url params instead of using jQuery. If data is large it is better to use jQuery. :)
as http://www.xyz.com?name="name".....
I'm not familliar with java servlets, but can't you keep the uploaded html in a server-side session variable, display the contents in your preview page, then save the contents of the variable out to the file system once the user accepts the changes ?
You could use JavaScript. On the button you add:
onClick="doMyOpenWindowFuncion();"
and within the script part of the page you write a function like
function doMyOpenWindowFunction() {
// if you want the client to wait, heres the place to do so.
// I assume you can make your servlet wait so the next line opens a window to the servlet
openWindow('/MyFancyPreviewServlet', 'Preview Window');
}
and in your Servlet you just wait for the file to appear before delivering it.