Print value using GET or POST

Question

My goal is to print the value entered in the Firstpage.html to basicform.html using GET or POST.

I need it to be done only using Html and JavaScript or Ajax.

Code for Firstpage.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <script type="text/javascript"> function result() { var x=document.forms["fom"]["name"].value; $_GET[0]=x; } </script> </head> <body> <form method="get" action="basicform.html" name="fom"> Your name: <input type="text" id="name" name="name" size="25" /> <br /> <input type="submit" value="submit" onclick="result()" /> </form> </body> </html>

This is the code in basicform.html

<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <script> function loaad() { var name = $_GET[x]; if(isset($_get(submit))) { document.write(name); } } </script> <body onload="loaad();"> </body> </html>

Your request is like: "I have to query a database to get a few items stored in a table. But PLS don't use SQL." — OddDev
– OddDev, Commented Mar 25, 2015 at 7:20
$_GET is PHP's super global variable, its not applicable in html files..! — Sudhir Bastakoti
– Sudhir Bastakoti, Commented Mar 25, 2015 at 7:21
You can use Localstorage for this. The method you are using is not correct. $_GET no any methods of javascript. You should be getting error for this. — Manwal
– Manwal, Commented Mar 25, 2015 at 7:21
You may keep these two html files in any webserver. And pass your input as query string to target html url. In target html file write js to read those query string values. This will make you understand few basics. as @Demouser said you cannot use php code in html files unless you are using any framework. — Murali Mopuru
– Murali Mopuru, Commented Mar 25, 2015 at 7:24
I did not get any error in using $_GET. I know that program is completely wrong please help me with a perfect program if u know. Thank You — Rookie
– Rookie, Commented Mar 25, 2015 at 7:25

Prashant G · Accepted Answer · 2015-03-25 07:31:59Z

You can only get the GET parameters using JavaScript. If JavaScript was able to access post variables, it would create security risks. This is how you would get the GET parameters using JS.

var $_GET = {}, args = location.search.substr(1).split(/&/); for (var i=0; i<args.length; ++i) { var tmp = args[i].split(/=/); if (tmp[0] != "") { $_GET[decodeURIComponent(tmp[0])] = decodeURIComponent(tmp.slice(1).join("").replace("+", " ")); } }

Umm can u please suggest me a code where I can use both Get or POST to print the values submitted in first form

Rookie · Accepted Answer · 2015-03-27 04:18:58Z

I Completed the Task Successfully using localStorage.

Code for Firstpage.html

<script> function store() { if(localStorage) { document.getElementById("contactForm").addEventListener("submit", function() { var name = document.getElementById("name").value; localStorage.setItem('name',name); var age = document.getElementById("age").value; localStorage.setItem('age',age); }) } } </script> </head> <body> <form id="contactForm" action="result.html" method="POST" > <label for="name">Name</label> <input type="text" name="name" id="name"> <label for="Age">Age</label> <input type="text" name="age" id="age"> <input type="submit" value="send" onclick="store()"> </form> </body>

and the result.html is

<script> window.onload= function() { var x =localStorage.getItem('name'); var y=localStorage.getItem('age'); if((x !="undefined") || (x!="NULL")) { document.getElementById("ret").innerHTML="hello "+x+" your are "+y+" years old"; } } </script> </head> <body> <div id="ret" style="position:absolute; left:400px; top:200px; height:400px; width:400px; text-align:center"> Result </div> </body>

Community · Accepted Answer · 2017-05-23 12:31:10Z

If you want to get GET parameter from Javascript use this function :

function getUrlParameter(sParam) { var sPageURL = window.location.search.substring(1); var sURLVariables = sPageURL.split('&'); for (var i = 0; i < sURLVariables.length; i++) { var sParameterName = sURLVariables[i].split('='); if (sParameterName[0] == sParam) { return sParameterName[1]; } } }

Reference: Get url parameter jquery Or How to Get Query String Values In js

Then simply use this:

var name = getUrlParameter('x'); //assuming url: http://yoursite.copm/?x=test document.write(name);

Umm can u please suggest me a code where I can use both Get or POST to print the values submitted in first form

Community · Accepted Answer · 2017-05-23 12:15:35Z

Your form is sending the data using get (different than PHP's $_GET). This means that the values sent will appear in the address of the web page the form is sent to - no need for JS on this page. For example, on submitting your firstpage.html form you may get to:

 basicform.html?name=Bob

This works well since JavaScript can get those parameters (not very cleanly, but it can). Put this on basicform.html:

function getQueryParams(qs) { qs = qs.split("+").join(" "); var params = {}, tokens, re = /[?&]?([^=]+)=([^&]*)/g; while (tokens = re.exec(qs)) { params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]); } return params; } var query = getQueryParams(document.location.search);

Then, you'll use the query variable to print out the name value.

document.write(query.name);

getQueryParams function from here on SO.

Also, the reason using $_GET didn't cause errors is that it's formed like any other valid JavaScript variable name. However, it's just that - the same as any JS variable - and has no relation to PHP's $_GET variable.

Umm can u please suggest me a code where I can use both Get or POST to print the values submitted in first form
JavaScript cannot directly access POST data. If yu need the form to submit POST instead of GET, you'll need to incorporate at least some PHP on the basicform.html page (would be basicform.php). See this post for some more details.

Collectives™ on Stack Overflow

Print value using GET or POST

4 Answers 4

1 Comment

Comments

1 Comment

3 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

1 Comment

3 Comments

Linked

Related