How to pass values from one HTML page to other using java script?

Question

I want to pass my value of one variable to another html page using query string.

first.html:

<body >
   <form id="form1" name="form1" action="2.html">
   <input type="text" name="txtFileName" id="txtFileName"/>

   <input type="hidden" name="hid1" value="">
   <br><input type="submit"  value="Send me your name!"  onClick="submitform();">
   <br>
   </form>
   <script type="text/javascript">
   function submitform()
   {
     document.form1.hid1.value="hidden value";

    document.form1.submit();
   }
</script>
  </body>

second.html:

<html>
<head>
<SCRIPT LANGUAGE="javascript">
function getQueryVariable2(variable) { 

  var query = window.location.search.substring(1); 
  document.write(query);
  var vars = query.split("&"); 
  document.write("<br />");
  document.write(vars);

  for (var i=0;i<vars.length;i++) { 
    var pair = vars[i].split("="); 
    if (pair[0] == variable) { 
      return pair[1]; 
    }
  } 
} 



</SCRIPT>
</head>
<body>
<h1>Good morning</h1>
<script LANGUAGE="javascript">
document.write("<br />txtFileName = " + getQueryVariable2("txtFileName"));
document.write("<br />hid1 = " + getQueryVariable2("hid1"));
</script>
</body>
</html>

As you suggested I created my pages. Still these are working the desired operation. What is my error?

Ian G · Accepted Answer · 2011-09-01 15:48:39Z

4

EDIT: I've edited slightly and this seems to work for me, what exactly is the problem?

Please explain what "required result" is..

Page 1

   <form id="form1" name="form1" method="get" action="2.html">
    <input type="text" name="txtFileName" id="txtFileName"/>

   <input type="hidden" name="hid1" value="">
   <br><input type="submit"  value="Send me your name!"  onClick="submitform();">
   <br>
   </form>
   <script type="text/javascript">
   function submitform()
   {
     document.form1.hid1.value="hidden value";

    document.form1.submit();
   }
</script>

Page 2

<SCRIPT LANGUAGE="javascript">
function getQueryVariable2(variable) { 
  var query = window.location.search.substring(1); 
  document.write(query);
  var vars = query.split("&"); 
  document.write("<br />");
  document.write(vars);

  for (var i=0;i<vars.length;i++) { 
    var pair = vars[i].split("="); 
    if (pair[0] == variable) { 
      return pair[1]; 
    }
  } 
} 


document.write("<br />txtFileName = " + getQueryVariable2("txtFileName"));
document.write("<br />hid1 = " + getQueryVariable2("hid1"));
</SCRIPT>

Have a look at this link http://www.htmlgoodies.com/beyond/javascript/article.php/3471111/A-Quick-Tutorial-on-JavaScript-Variable-Passing.htm

edited Sep 1, 2011 at 15:48

answered Sep 1, 2011 at 11:33

Ian G

30.3k22 gold badges82 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Pushpendra Kuntal Over a year ago

dear sir i have done this type of efforts so many times. So please please check my code and tell me the mistake i have done. please dont tell me alternate. i have tried so many alternates.

Pushpendra Kuntal Over a year ago

sir i want to display the value of that hidden variable into the second page means in 2.html

Aaron Digulla · Accepted Answer · 2011-09-01 12:25:01Z

2

Add method="get" to the form element. Otherwise, POST (the default) might be used which passes parameters in a different way.

See: FORM method attribute

answered Sep 1, 2011 at 12:25

Aaron Digulla

330k111 gold badges626 silver badges840 bronze badges

Collectives™ on Stack Overflow

How to pass values from one HTML page to other using java script?

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related