jQuery和AJAX-页面刷新后获取请求

Question

I'm creating an AJAX function that can make a request for insert a new line in a database and then expose the result in the browser web of the client. So I made this things:

script.js

/* bla bla bla*/

function submitAjaxFunction() {

    var data = { /*some data*/ };

    $.ajax({
        type: "POST",
        url: "/*my url*/",
        data: data,
        success: function(response){
            /*add a new row in #results*/
        },
        error: function(e){
            /*things*/
        }
    });
}

/* bla bla bla*/

page.html

/* bla bla bla*/

<input type="button" value="Insert new Line">

/* bla bla bla*/

<table id="results">
    /* list of row in the database */
</table>

Logic.java

public class Logic extends AuthorizedAction {

    /* bla bla bla*/

    public ActionForward doAction(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) throws Exception {

        /* bla bla bla*/

        String result = null;

        /* things for fill result */

        response.setContentType("text/text;charset=utf-8");
        response.setHeader("cache-control", "no-cache");
        PrintWriter out = response.getWriter();
        out.println(result);
        out.flush();
        return null;
    }
}

The problem is that the logic behind the insertion of a new row (essentially the Java method) is quite time-expending. So, we can have two scenarios:

A) The waiting user don't do anyting untill the logic end : in this case "submitAjaxFunction" work perfectly and it add the new row whitout the page refresh;

B) The waiting user refresh the page before the logic end : in this case we "lost" the response and the function "submitAjaxFunction" can't add the new row in #results. For see the new row, the user will have to refresh the page again;

The second scenario is not what good for me. Is it possible to get the AJAX response even if the page was refreshed?

Thanks

Answer 1

If you immediately want to do some operation after form submission I will suggest to not wait for the first request to finish and then initiate a second one, rather do it in the first.

If you need to initiate the second request based on some some parameters, then send them too, with the first request and process your logic in JAVA side

Answer 2

I suppose the response from your java code is html string, not Json Response: If you wait for some values from the backend, you can do it with ajax.

<table id="results">

</table>

var data = { /*some data*/ };
$.ajax({
    type: "POST",
    url: "/*my url*/",
    data: data,
    success: function(response){
        // Refresh the whole table, not a good one, there's other powerful ways to do it. such as refresh only the affected row
        $("#results").replaceWith($("#results",response)); // or $("#results").html($("#results",response).html());

    },
    error: function(e){
        /*things*/
    }
});

If the backend has nothing to add to the dom, just append the table with other rows

var html =  "<tr><td></td>....</td>";
$("#results tbody").append(html);