How to redirect response from ajax request

Question

I need to redirect to a page from response. I made a ajax call and can handle success. There is html page in response, but how to redirect it to that page.
Here's my code.

$("#launchId").live('click',function(){
    var id= $("#id").val();
    var data = 'id='+id;
    $.ajax({
        url: "xyz.json",
        type: "post",
        data: data,
        dataType: 'json',
        complete : function(response) {
             window.location.href = response;                  
        }
    });
 });

Add a `console.log(JSON.stringify(response));` before `window.location.href = response;` and post what you get here. — techfoobar, Jun 01 '13 at 09:41
You are not using 'success' callback here but 'complete'. What if your server returns an error? I'll suggest you to use 'success' callback instead. — A. Wolff, Jun 01 '13 at 09:52
@hemanth: Why do you use ajax for that? Just let a form submit to that URL and load the page as one normally would do. Btw, giving a html file a `.json` extension is odd. — Bergi, Jun 01 '13 at 09:52

Ramaraj Karuppusamy · Answer 1 · 2013-06-01T10:06:04.457

3

Please try this.

var newDoc = document.open("text/html", "replace");
newDoc.write(response.responseText);
newDoc.close();

edited Jun 01 '13 at 10:06

answered Jun 01 '13 at 09:48

Ramaraj Karuppusamy

2,350
5
24
35

Bergi · Accepted Answer · 2013-06-01T10:12:10.760

Not using ajax would make this easier:

<form type="POST" action="xyz.json">
    <label for="id">Enter ID:</label><input id="id" name="id">
    <button type="submit" id="launchId">Send</button>
</form>

If you really want to use ajax, you should generate a distinct server response, containing only the HTML parts you want to update in your page or actual JSON.

If you insist on using the response which you currently get, the appropriate way of dealing with it would be document.write:

$.ajax({
    url: "xyz.json",
    type: "post",
    data: data,
    dataType: 'html', // it's no JSON response!
    success: function(response) {
         document.write(response); // overwrite current document
    },
    error: function(err) {
         alert(err+" did happen, please retry");
    }
});

score 1 · Answer 3 · answered Jun 01 '13 at 09:46

1

Your response is an object containing the full HTML for a page in the responseText property.

You can probably do $(body).html(response.responseText); instead of window.location.href = ...; to overwrite the current page content with what you got a response.

...
complete : function(response) {
    $(body).html(response.responseText);
}

But i suggest you don't and there could be style and other conflicts with whats already there on the page.

answered Jun 01 '13 at 09:46

techfoobar

65,616
14
114
135

And if the complete page is getting updated it would be better if he just submits a form right? – tusharmath Jun 01 '13 at 09:47
@TusharMathur - Yes, no real need for AJAX post in this particular case. – techfoobar Jun 01 '13 at 09:49

score 0 · Answer 4 · answered Jun 01 '13 at 09:46

In your HTML add a div with id as 'content', something like this

<div id='content'/>

Since your response is html in your complete function append the content into the div like this -

 complete : function(response) {
         $('#content').append(response.responseText);
    }

Let me know if you still face issues.

score -2 · Answer 5 · answered Jun 01 '13 at 09:40

-2

try this

$("#launchId").live('click',function(){
    var id= $("#id").val();
    var data = 'id='+id;
    $.ajax({
        url: "xyz.json",
        type: "post",
        data: data,
        dataType: 'json',
        complete : function(response) {
             window.location.href = '/yourlocation?'+response;                  
        }
    });
 });

answered Jun 01 '13 at 09:40

Subhra Sekhar Mukhopadhyay

156
14

plz explain what is "live method is deprecated" ? @Baadshah – Subhra Sekhar Mukhopadhyay Jun 01 '13 at 09:44
@SubhraSekharMukhopadhyay see here http://stackoverflow.com/questions/11115864/whats-wrong-with-the-jquery-live-method – PSR Jun 01 '13 at 09:45
kk thanx for downVoting @Bergi – Subhra Sekhar Mukhopadhyay Jun 01 '13 at 09:46
1

@Subhra: It wasn't me, so I cannot remove the downvote. And the answer is still invalid, as the op claims `response` to be HTML markup instead of an URI part. – Bergi Jun 01 '13 at 09:48

How to redirect response from ajax request

5 Answers5

Linked