We help IT Professionals succeed at work.

i reload the page with success message when ajax response will get from java controller

puneet kumar
puneet kumar asked
on
High Priority
74 Views
Last Modified: 2020-02-18
How can i reload the page with success message when ajax response will get from java controller .
Case - i am sending an ajax request to java controller it is successfully going to java controller i am setting a response in controller and revert it back to jsp . while success i want to reload the page with success message which i already set in java controller.
Comment
Watch Question

Scott FellDeveloper & EE Moderator
CERTIFIED EXPERT
Fellow
Most Valuable Expert 2013

Commented:
You do not refresh the page. Instead, you inject the response to an element.

Let's say your jsp page outputs, "This is the response".  And you want to put the response in a div#results

https://jsfiddle.net/cw2g5f49/

HTML
<div id="results"></div>

Open in new window

JQUERY
  var response="This is the response";
  $('#results').html(response);

Open in new window


Putting that to your ajax https://api.jquery.com/jquery.ajax/ request, you simply inject your result in the done or success function.
$.ajax({
  method: "POST",
  url: "page.jsp",
  data: { name: "John", location: "Boston" }
})
  .done(function( msg ) {
    //alert( "Data Saved: " + msg );
     $('#results').html(msg );
  });

Open in new window


This assumes your result is either html or text. If it is outputting json, you will need to parse the json in your done/success function first.

Author

Commented:
yes but if my page is not refreshed on success how can page communicate with database and show the latest data.hope you understand.
Scott FellDeveloper & EE Moderator
CERTIFIED EXPERT
Fellow
Most Valuable Expert 2013

Commented:
This part
.done(function( msg ) {
    //alert( "Data Saved: " + msg );
     $('#results').html(msg );
  });

Open in new window

is extracting the data from your jsp page after it has completed. Then places the results on the page.

Do a test. When you do use the browser dev tools by hitting F12. Look in the Network tab and go to the xhr tab. Run the page and you can see your jsp page appear.  Click on the page name in dev tools. Once you do that, you will have new tabs for Headers, Preview and Response .The header tab shows what is being sent to your controller. The other two tabs show the response that your done/success function grabs.

No need to refresh the screen.
Scott FellDeveloper & EE Moderator
CERTIFIED EXPERT
Fellow
Most Valuable Expert 2013

Commented:
There is a good tutorial on https://www.codecademy.com/learn/learn-jquery

Take an hour or so to go through it. If you are not familiar with javascript, go through that first https://www.codecademy.com/learn/introduction-to-javascript  It will be well worth spending part of a day on to better understand what is going on here.
CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019

Commented:
yes but if my page is not refreshed on success how can page communicate with database and show the latest data.hope you understand.
Then the question is - why are you using AJAX? If you need a server side refresh then posting by AJAX, getting a response and then refreshing the page to re-render does not make sense. Might as well post directly to the controller and get the rendered page back.

If you really want to do it this way then
// AJAX request (assuming jQuery)
$.ajax({
  ...,
  dataType: 'JSON' // Assume a return type of JSON
}).then(function(resp) {
   // Assumes a JSON structure { status: true } [You did not specify so have to improvise]
   if (resp.status) {
     // Do the redirect to the target page
     window.location.href = "https://path/to/your/target_page.jsp";
   }
});

Open in new window

Author

Commented:
Hi julian Thanx for for your support please let me know i want to reload the page with previous data . your function works refresh with no previous data.
CERTIFIED EXPERT
Most Valuable Expert 2017
Distinguished Expert 2019
Commented:
My solution does a page refresh which is what you asked for. If the page does not contain the data you want to see then the problem is with the page you are targeting.

Your response, however, is unclear - I have no idea what you mean when you say it must reload with previous data. We have no context for your application's function so answering this question (beyond what I have given you) is difficult.

Scott has already suggested how you can display the success message on the page.
You responded with
yes but if my page is not refreshed on success how can page communicate with database and show the latest data.hope you understand.
But now you are saying you don't want the latest data you want the previous data.

It is a bit confused.

If you can clarify what you are wanting to do we can help you but as it stands you have not given us enough information.

Additionally, when you respond to a post try to be as descriptive as possible. Saying "it does not work" does not help us. You need to tell us
a) What you did - show us your implementation
b) What you expected to see
c) What was actually presented
d) Any errors / warnings or other such information that you observed during the test.

Remember: we cannot see what you see (unless you show us) and we cannot know what you know (unless you tell us).

Author

Commented:
You guys are extremely helpful thanx a ton for support.