I have a JSP page that at the end comes a pop-up window from a javascript, I want after the users click to reload only a specific part of the JSP page more specific one if - loop want to be reloaded one more time ...can this happened or the idea is totally wrong ?
What you are looking for is called AJAX.
AJAX is the art of exchanging data with a server, and updating parts
of a web page - without reloading the whole page.
jQuery has a very nice ajax api.
To load html pages, you could use jQuery.load like this:
$("#result").load( "ajax/test.html" );
You can also generate dynamic html by calling a REST function of a php page using a different url. Example:
var data = { limit: 25, otherProp: "val" }
$("#result").load( "getHtmldata.php", data);
Related
I have a situation that i can't handle and thats why need your help.
I have a jsp page (mention as A in below pic) where there are many rows and each of them can be edited.
At the end of the A jsp page, there is an option to print the page data.
Now, if some body clicks on the edit link/button, another page will open contain the data for that particular row and user can modify the data in the second page(i,e B).
Now, i want, as soon as the user save the B page, A page should be refreshed automatically to provid the updated data for printing.
Please guide me on how to acheive that . I'm using Spring MVC framework for the java application.
The Spring MVC way to meet your requirement is:
the Edit buttons in page A should be links calling page B with the id of the line to edit, something like Edit
the SaveAndClose button in page B should be a submit button that posts the edited values to a controller method. After server side processing, the controller method should redirect to page A. As a side effect, you use the PostRedirectGet pattern which avoids the ugly do you want to send again ... ?"
#RequestMapping(path = "...", method = RequestMethod.POST)
public String saveAndClose(...) {
...
return "redirect:/path/to/pageA";
}
Of course this will display all pages in same window.
If you want to redisplay the window containing pageA on the Save & Close from page B, still allowing the save to be known to the server, you should redirect to a special page (say pageC) that just contains javascript code asking the browser to redisplay pageA. You can either pass the name of the window containing pageA in a hidden field, or you can decide that as the programmer of the web application you know where it should be.
It can be achieved like this. Follow the steps mentioned
1] When you click on edit button in Page A, pass the id of the row to Page B as request parameter.
2]In Page B JSP receive the id of the row and store it in a hidden element.
3]Create a JavaScript function in Page A which should receive row Id and Modified data as parameter. Lets name it this function as updateRows(rowId,modifiedData). In this function write code to update the with id 'rowId' with modified data using javascript
4]Now When you click on 'Save & Close' Button in Page B. Save the data using call to server. If save succeeds then invoke the function updateRows passing it rowId stored in hidden element and modified data as parameters. This function will update the DOM with latest data.
This way you will avoid making server call to refresh the data
There is one more way if you don't want to use ajax.
In Page A define a javascript function refreshPageA(). In this function add page refreshing logic.
When you click on 'Save & Close' button in Page B save the data in server and forward to a plain jsp. In this JSP declare a onload handler. Inside onload handler add following code
opener.refreshPageA();
window.close()
This will refresh pageA and close page B window
I'm using blockui with standard form post(java+struts1) no ajax or anything. It works great, but Im just wondering is this considered an ok thing to do. Basically all I wanted to do was lock
the browser screen upon submitting the form (when click on link) and show a message. I'm asking because it seems a lot of blockui examples use an ajax request.
My requirement is avoid user hitting multiple links on the page at a time. now as soon as clicking on one link blocking the page with this blockui (https://github.com/malsup/blockui/) until the process finishes and load the page with new data.
--------------- updated ----------------
I did 2 steps:
dowloaded the 'jquery.blockui.min.js' from https://github.com/malsup/blockui/ and added this js file in my workspace
added below code snippet in my jsp
$('#linkX').click(function() {
$.blockUI({ message: '<h1><img src="busy.gif" /> Just a moment...</h1>' });
});
now when i click on any links (all links has same class name) the page blocks with popup message "jest a moment". since i have form action in the jsp as <html:form action="/xxx.do"> it perfomrs the process backside and enter some data in the database (until that process completed few seconds main page blocks with this popup message which i needed to control the user hitting another link which interupts the 1st link process), and it loads the page back (with new data). Automatically on page load this unblocks the ui.
this blockui perfectly fulfilling my requirement. But every where this blockui getting used with Ajax calls not with regular form submit so i wonder whether it can be also used with regualr form submit too or not? (or if there is any other simple solution to block the ui as Im not using Ajax)and is this dowloaded blockui javascript file is safe to use (as Im working for the federal company)?
My main goal: When i click the link, a new browser window should be opened and displays the content of entire log file. And the window should not have an address bar and navigation buttons (Back, Forward).
Is there any approach to do this in Spring-MVC project?
Here is what i am doing now:
When i click the link, the controller will be called with a parameter logName.
Now the controller have access to get any kind of details of the log file like content, path, etc... I am setting all these details to an object and sending back to JSP.
Here i am not sure how to open a new window and display the content of the log file in that window.
Please suggest me an approach on this!!
It would be very helpful for me if you can share me with some examples...
Spring or JSP have nothing to do with it, the only way to force user's browser to open a link in a new tab is to use client-side Javascript. window.open() allows configuring the popup to hide certain interface elements (see all options in the documentation)
Your code would look something like:
<input type="button" value="Show Log" onclick="showLog(logName)">
function showLog(logName) {
var url = "/path-to-your-controller.html?logName=" + logName;
window.open(url, "LogPage", "toolbar=no,location=no,menubar=no");
}
However, I don't think using a customised browser popup is a good solution; it's been disappearing from the web for a reason. It would be more elegant to fetch raw data using AJAX and display it in a JS popup: it wouldn't interfere with user's page navigation (you tagged the question with jQuery, you could use jQuery UI for that).
What is more, I wouldn't be surprised if window.open wasn't supported by all browsers in the same way† - something to keep in mind if you're targeting a wider audience.
† seems that Chrome ignores location=no, for instance
I am developing a web project using spring mvc and dojo. I have a unique problem. This is what I am doing :
Submit a form to the controller and generate a pdf in the controller. Set the pdf in the response
The target of the form is an iframe so that the pdf shows in the form after submit.
This works perfect.
Now, my problem is :
I am doing validations on the form using spring mvc validator and if there is an error I must return to the same page with the error message(s).
The problem is to combine these two approaches. If I find an error and return with the return view, since the target of the form is the iframe, the response gets shown in the iframe which obviously I don't want (I want to show the new page) and if everything is good, I must set the pdf in the response and show it in the iframe using the target. How can I achieve this?
You didn't mention whether you are using ajax to submit the form. If its ajax then it would be straight forward, I think you are not.
If you are doing a normal form submit, then
Don't target the form submit to an iframe.
That solves your problem but it introduces a new one, handling the PDF response.
When your form submission passes the validation instead of returning the PDF return the same view but with some javascript code, dojo in your case, at the bottom of the page to popup an iframe whose url points to the pdf stream.
If you are using Spring MVC 3.1 you can make use of Spring MVC Flash Attributes to share any data between your form processing method and PDF serving method, If you are using previous versions of Spring you can use Session or capture the information in the redirect url to share any information between those two methods.
If you can use AJAX:
Submit the form using AJAX and return an URI for the PDF. Then set the source of the iframe to the returned URI if the validation was ok.
If can't or don't want to use AJAX:
Return the same page again but this time with the source of the iframe already set to the PDF, if the validation was ok.
Hello i need some help to figure out what to do .
I am trying to create a page that has a list of events and each time I click one of the list's elements a different photo gallery should load. I did this by loading each gallery in a different iframe.
The problem is that right now the only thing it dose is loading the first galery and the other ones don't seem to manage loading any pictures (if I refresh each frame than they work fine)
What should i do?
This is the script I used in the webpage
You can find the page source here http://www.avantsolutions.ro/exp.txt
You can try with jQuery UI Plugin instead of iFrame.
On clicking of list item(West pane), you can load center pane div with corresponding images.
Check the examples here.
You can use jQuery's load function to load a gallery via ajax.
$(selectorForYourGalleryDisplayDiv).load( url, [ data ], [ complete(responseText, textStatus, XMLHttpRequest) ] )
Load will take the result from url, if you need to pass it data it will use a HTTP POST, and replace the inner html of the wrapped set it is called on.
I don't know the internals of your architecture, but the main process is giving your galleries Ids, pass them to the server using the JSON format, your code will use that id to get what's needed for the gallery, render the html and return it.
load will drop that html into the elements that match selectorForYourGalleryDisplayDiv.