Javascript - redirect to a page with POST data

Question

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 comments to explain it better. Thanks alot.

Try and see if the following question has the answer you need: http://stackoverflow.com/questions/9713058/sending-post-data-with-a-xmlhttprequest The keywords are XMLHttpRequest and POST. You use the former to initiate a POST request to a web server, with JavaScript. — amn, May 27 '13 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, May 27 '13 at 13:55

Sharky · Accepted Answer · 2013-05-27T14:09:00.260

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.net/MDx8H/1/ (alerts instead of submits)

edited May 27 '13 at 14:09

answered May 27 '13 at 13:45

Sharky

5,671
3
35
66

Wow, how did I miss the first one. I changed the name's here on purpose but I really didn't see it was "type". Cheers for that. But for the second one: I am inside the already. – Yannick Bloem May 27 '13 at 13:49
lol the first one is quite common dont feel bad :) did i guessed correctly on the second one?? it drove me crazy sometime ago while i was debugging and in in one pageview i was getting 2 inserts in my db... it drove me absolutely crazy!! – Sharky May 27 '13 at 13:52
Haha thanks ! Well for the 2nd one, I am inside the body...it reloads a a blank page only containing .. – Yannick Bloem May 27 '13 at 13:54
It works perfectly! (the 2nd solution). AMazing, thanks a lot. – Yannick Bloem May 27 '13 at 14:18

Javascript - redirect to a page with POST data

1 Answers1

Linked