Show loader while waiting for servlet to forward to next page

Question

I have an index.html where I have a form. When I press submit that form does a POST request to my servlet. This servlet does some heavy things and then forwards to a jsp. What I want is when I press submit, to show a loader. I know how to do this via javascript (preventDefault etc). I don't want that. Can this be accomplished by the servlet? I was trying to output a "page" that contains only the loader, and then do the heavy stuff, and in the end forward to a jsp. That didn't work. For some reason it doesn't even leave the index.html, just stays there until the servlet is finished, and in the end I get forwarded to the jsp.

Thank you for your help

Answer 1

This can only be accomplished using AJAX.

So, on the click of the submit button, display the Loading image, and make the ajax call to the servlet. So while the servlet will be processing, the loading image will be displayed. Uppon returning from ajax call, you can use javascript to do any actions you require (forward user to another page / show errors .. etc).

I highly recommend you to see JQuery Ajax (this is the most easy and effective script I have ever used)

$.ajax({
    type: 'POST',
    url: '/myServlet',
    data: {
        name: $('#name').val()
    },
    beforeSend:function(){
        // this is where we append a loading image
    },
    success:function(data){
        // successful request; do something with the data            
    },
    error:function(){
        // failed request; give feedback to user
    }
});

Answer 2

You can use Ajax.. on form submit make a ajax call to servlet which will return the things / html nedded to show loading page. you can use that returned page to replace the form or anything in current page.

after ajax form submission will continue as ususal... when other Servlet finishes the processing you will be redirected to result page.