jQuery Ajax and redirect response from server

Question

I have a situation where I send jquery ajax post request but in my web application, the handler for this specific ajax request (after processing post parameters), will invoke an action in another controller ( not sure if this is called redirect) which basically renders the whole website page ( like page refresh). But I notice browser keeps display the same page instead of refreshing to the content of the new page.

Is there something wrong? How can I deal with this situation?

I had to edit my question because I changed my ajax call.

This is what the code looks like:

function chkSubmit(event, actionType) {


        var msgid = showlst('Please wait ...');
        var data = ''
        if (actionType == 'IAmDone') {
            var letters = 'e,b,c'

            data = 'actionType=' + actionType + '&letters=' + letters;

        } else data = 'actionType=' + actionType;
        $j.ajax({
            type: 'POST',       
            url: context + '/app/handleChk',
            data:  data
        });

        return false;
}

The above function runs when a button on the page is clicked. But this same page keep displaying. The browser debugger shows that it did receive 200 OK response from the new action which it was supposed to refresh page with. I am using Chrome browser and jquery 1.6.1

Sorry for my typo in code sample. I corrected it.

" var msgid = showlst('Please wait ...'); var actionType = type" what's type? — MLS, Jul 07 '11 at 14:00
Does this answer your question? [How to manage a redirect request after a jQuery Ajax call](https://stackoverflow.com/questions/199099/how-to-manage-a-redirect-request-after-a-jquery-ajax-call) — Dharman, Jul 04 '21 at 15:19

score 16 · Accepted Answer · answered Jul 07 '11 at 14:11

The server can not do a redirect from an ajax request. In the end ajax involves the client (browser). If you want to redirect you can do it, but it is going to have to be done on client side, in the callback. You can do that by returning an object from the server which contains the url you want to redirect to--- you can then you javascript to change the document's location property. I would think that this would make sense if you were not redirecting in all cases, or if your server side call was a long running process. If neither is the case then an ajax call probably doesn't make sense in the first place.

picus · Answer 2 · 2011-07-07T14:05:04.440

I may be misreading your question, but where is your success callback function in that ajax call? That is where you would typically render the results into the view, also, you could use the error callback to get some data on what, if anything is going wrong:

function chkSubmit(event, actionType) {


        var msgid = showlst('Please wait ...');
        var actionType = type // per j. tuskan - looks like no such var in scope
        var data = ''
        if (actionType == 'IAmDone') {
            var letters = 'e,b,c'

            data = 'actionType=' + actionType + '&letters=' + letters;

        } else data = 'actionType=' + actionType;
        $j.ajax({
            type: 'POST',       
            url: context + '/app/handleChk',
            data:  data,
            success:function(the_data){
              alert("Now I can do stuff with the ajax response which is: "+the_data);
            }
        });

        return false;
}

score 2 · Answer 3 · answered Jul 07 '11 at 14:22

2

Example of what has been said by @ek_ny.

jQuery.ajaxSetup({
    complete: function (request, textStatus) {
        // header inserted manually on the server.
        // you should block the automatic redirect headers 
        // inserted by the server.
        var location = request.getResponseHeader("Location");
        if(location) window.location = location; 
    }
});

answered Jul 07 '11 at 14:22

Thomas

463
3
8

I tried your solution which looks the correct approach but it did not work because there is no Location header in the response http headers. – rjc Jul 07 '11 at 14:51
In my case I directly put complete: function ... under the ajax request rather than using jQuery.ajaxSetup because not all my ajax request needs to do this. – rjc Jul 07 '11 at 14:54
As I said in answer, you need to identify the ajax request on the server and treat it differently, you need to insert the header that informs the new url manually. – Thomas Jul 07 '11 at 16:27

score 0 · Answer 4 · answered Mar 26 '19 at 07:02

0

You can not do server side redirection using Ajax because whenever you use Ajax, response will come to success/error function of Ajax. You can do server side redirection using 'form' in JavaScript.

answered Mar 26 '19 at 07:02

Ganesh

144
1
5

jQuery Ajax and redirect response from server

4 Answers4

Linked