ajax - Javascript - redirect to a page with POST data - Stack Overflow

I've got a page where the user can search (all in AJAX) in the database and select, let's say, different type of data on the page. When's he chosen them, what I need is to redirect the user to ANOTHER page (still on my website though), with POST data. The new page where the user will arrive needs that POST data, and the user needs to go to the new page.

I've read that I could create a form before loading the page and simply submit it when I want to redirect, but the thing is that I don't have the data that will be included in the before hand.

I've tried doing something like this:

document.write('<form id="reviseCombi" method="post" action="otherPage.php"><input name="input1" type="hidden" value="ok" /><input type="input2" type="hidden" value="'+ mots +'" /></form>');
f=document.getElementById('reviseCombi');
if(f){
    f.submit();
}

But the second input doesn't arrive to the new page when I check with Tamper Data. And it reloads the actual page first, which is weird too.

Is there a better way to do it?

EDIT: I got an answer for the input part. The page now gets the two inputs. But: it still reloads a blank page ONLY containing the form (and the html, body, etc.) and then it redirects. Any idea how I can have it directly?

Sorry if it's not very clear, it's tough to explain. I'll answer any ments to explain it better. Thanks alot.

I've got a page where the user can search (all in AJAX) in the database and select, let's say, different type of data on the page. When's he chosen them, what I need is to redirect the user to ANOTHER page (still on my website though), with POST data. The new page where the user will arrive needs that POST data, and the user needs to go to the new page.

I've read that I could create a form before loading the page and simply submit it when I want to redirect, but the thing is that I don't have the data that will be included in the before hand.

I've tried doing something like this:

document.write('<form id="reviseCombi" method="post" action="otherPage.php"><input name="input1" type="hidden" value="ok" /><input type="input2" type="hidden" value="'+ mots +'" /></form>');
f=document.getElementById('reviseCombi');
if(f){
    f.submit();
}

But the second input doesn't arrive to the new page when I check with Tamper Data. And it reloads the actual page first, which is weird too.

Is there a better way to do it?

EDIT: I got an answer for the input part. The page now gets the two inputs. But: it still reloads a blank page ONLY containing the form (and the html, body, etc.) and then it redirects. Any idea how I can have it directly?

Sorry if it's not very clear, it's tough to explain. I'll answer any ments to explain it better. Thanks alot.

• javascript
• ajax
• post
• http-redirect

Share Follow edited May 27, 2013 at 13:59 Yannick Bloem asked May 27, 2013 at 13:41 Yannick BloemYannick Bloem 14722 gold badges44 silver badges1212 bronze badges 3

• 1 Try and see if the following question has the answer you need: stackoverflow./questions/9713058/… The keywords are XMLHttpRequest and POST. You use the former to initiate a POST request to a web server, with JavaScript. – Armen Michaeli Commented May 27, 2013 at 13:44
• "But: it still reloads a blank page ONLY containing the (and the , , etc.) and then it redirects." if you wrote some tags like < BODY > etc in your edit now, it got vanished because of the stackoverflow formatting... leave spaces like this < BODY > to show it so we can read and help :) – Sharky Commented May 27, 2013 at 13:55
• yeah I just took the <> away ;-) – Yannick Bloem Commented May 27, 2013 at 13:59

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 2

Q: "But the second input doesn't arrive to the new page"

A: Your second input does NOT have name! (type="input2" make it name="input2")

Q: "And it reloads the actual page first, which is weird too."

A: If you are using firefox and you echo data before the < DOCTYPE > and < HTML > tags, you get an auto refresh. if you wish to debug, echo data inside the < BODY >

A2: Its possible that the strange reload happens because you are doing that document.write of the form outside the < BODY > or maybe inside the < HEAD > ... if thats the case why not doing this:

html

<div id="myformcontainer"></div>

js

function CreateAFormInsideMyDivAndSubmitIt(mots)
{
    var mydiv = document.getElementById('myformcontainer').innerHTML = '<form id="reviseCombi" method="post" action="otherPage.php"><input name="input1" type="hidden" value="ok" /><input name="input2" type="hidden" value="'+ mots +'" /></form>';
    f=document.getElementById('reviseCombi');
    if(f){
    f.submit();
    }
}

jsfiddle: http://jsfiddle/MDx8H/1/ (alerts instead of submits)