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, Mar 25 '15 at 07:20
$_GET is PHP's super global variable, its not applicable in html files..! — Sudhir Bastakoti, Mar 25 '15 at 07: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, Mar 25 '15 at 07: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, Mar 25 '15 at 07: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, Mar 25 '15 at 07:25

score 1 · Answer 1 · answered Mar 25 '15 at 07:31

1

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("+", " "));
    }
}

answered Mar 25 '15 at 07:31

Prashant Ghimire

4,890
3
35
46

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 Mar 25 '15 at 11:13

score 1 · Accepted Answer · answered Mar 27 '15 at 04:18

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>

score 0 · Answer 3 · edited May 23 '17 at 12:31

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 — Rookie, Mar 25 '15 at 11:13

score 0 · Answer 4 · edited May 23 '17 at 12:15

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 — Rookie, Mar 25 '15 at 11:11
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](http://stackoverflow.com/a/11799118/1265817). — DACrosby, Mar 25 '15 at 20:48

Print value using GET or POST

4 Answers4