How to get values from posted html form using javascript

Question

I have two html forms and I am posting input data from one html form to another html form.I want to retrieve values of variables that was posted using form 1 on the form 2.

<form name ="form1" id ="form1" method ="post" action = "form2.html>
   <input id ="sendToForm2" type ="hidden" value ="send this to form2"/>
</form>

My question is how to get the value of the hidden variable sendToForm2 on form 2 once it is posted from form 1 to form 2 using javascript.

Just do not use POST but GET, you'll need to parse URL but you'll have them. For POST method you need some sort of server side code. — Adriano Repetti, Mar 24 '14 at 12:26
No. Both are on different html pages. form1 on form1.html and similarly form2 on form2.html. — Sanjeev Singh, Mar 24 '14 at 12:26
@Adriano is correct, if you use get, it will post the values as a query string. — Smeegs, Mar 24 '14 at 12:26
Explanation: with POST data will be sent through headers but a plain HTML page does not have access to that, it has only its own HTML code and URL. — Adriano Repetti, Mar 24 '14 at 12:27
What is your form2.HTML for ? And what do your intend doing generally so that you are guided in the right part — BlackPearl, Mar 24 '14 at 12:31

score 2 · Accepted Answer · edited May 23 '17 at 11:45

You can't use POST method because with a plain HTML page you do not have HTTP headers but HTML page code itself and URL (with query string).

What you can do is to use GET instead of POST then parse query string to extract them:

<form name ="form1" id ="form1" method ="GET" action = "form2.html>
   <input id ="sendToForm2" type ="hidden" value ="send this to form2"/>
</form>

Then in your form2.html you can use this function (from this post on SO) to parse query string:

function getParameterByName(name) {
    name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
    var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
        results = regex.exec(location.search);
    return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}

Now (let me use jQuery) you can access them with this:

<form ...>
   <input id ="sentFromForm1" type ="hidden" value =""/>
</form>

</script>
    $("#sentFromForm1").val(getParameterByName("sendToForm2"));
</script>

How to get values from posted html form using javascript

1 Answers1