Click here to Skip to main content
14,880,178 members
Please Sign up or sign in to vote.
1.22/5 (2 votes)
See more:
I have 2 HTML pages and in the 1st HTML page there are 2 JavaScript Variables & I want to pass the values of those 2 to another 2 variables in the 2nd HTML page. I am expecting an answer not using HTML 5.

How can I able to do that?

Thanks & regards,
Chiranthaka
Posted
Updated 10-Jul-20 0:51am
Comments
Peter Leow 10-Jul-14 8:19am
   
Just added response to your additional query.

See example, 100% javascript:
page1.html
<!DOCTYPE html>
<html>
<head>
<title>Acknowledgement</title>
</head>
<body>
<script>
var value1="value1";
var value2="value2";
var queryString = "?para1=" + value1 + "&para2=" + value2;
window.location.href = "page2.html" + queryString;
</script> 
</body>
</html>

page2.html
<!DOCTYPE html>
<html>
<head>
<title>Acknowledgement</title>
</head>
<body>
<h4>These are the data from page1.html.</h4>
<script>
 
var queryString = decodeURIComponent(window.location.search);
queryString = queryString.substring(1);
var queries = queryString.split("&");
for (var i = 0; i < queries.length; i++)
{
  document.write(queries[i] + "<br>");
}
 
</script> 
</body>
</html>

launch page1.html on browser and what do you see?
   
v2
Comments
Chiranthaka Sampath 10-Jul-14 6:55am
   
It worked pal & I modified the source code as at the below to get values from a form but the data didn't pass as expected. Instead of that only the form was resetted. The source code is at the below. So could you look at that again?

<body>

<script>
function passing(){
var firstDate=document.getElementsByName("firstDate");
var secondDate=document.getElementsByName("secondDate");
var queryString = "?para1=" + firstDate + "¶2=" + secondDate;
window.location.href = "SecondPage.html" + queryString;
}
</script>

<form önsubmit="passing()" >
<input type="text" id="firstDate" name="firstDate" /><br />
<input type="text" id="secondDate" name="secondDate" /><br />
<input type="submit" value="submit" />
</form>

</body>

Thanks.
Peter Leow 10-Jul-14 8:07am
   
Why didn't you mention that you use form in the first place, then I would have directed you to my winning article: http://www.codeproject.com/Articles/761123/Beginners-Guide-to-HTML-CSS-Formidable-Forms-with which has covered this.
Anyway, I suggest:
1. remove all the javascript from the page1.html
2. modify the form tag like this
<form action="page2.html" method="get">
Any more doubts, read my article.
Chiranthaka Sampath 11-Jul-14 0:13am
   
Now I want to store these 2 values into 2 JavaScript variable called sDate and eDate. Then how I should do that? I've managed to edit the statement at the second page as at the below.

var queryString = decodeURIComponent(window.location.search);
document.write(queryString);

But it gave me an output as at the below.

?firstDate=Today+is&secondDate=11/07/2014

Now I want to pass that 2 values to sDate & eDate. So what should I change in the SecondPage.html page?
Chiranthaka Sampath 14-Jul-14 6:32am
   
Now the 2 values firstDate & secondDate are in the pages' URL as 'SecondPage.html?firstDate=01%2F01%2F2016&secondDate=05%2F05%2F2016'. Now I want to add the firstDate & secondDate values into two separate variables in the SecondPage.html. These variables are JavaScript variables. Then pal how can I do that?
YAGA MOUNICA 25-Apr-21 6:21am
   
gjgh
Chiranthaka Sampath 11-Jul-14 1:41am
   
Now I want to store these 2 values into 2 JavaScript variable called sDate and eDate. Then how I should do that? I've managed to edit the statement at the second page as at the below.

var queryString = decodeURIComponent(window.location.search);
document.write(queryString);

But it gave me an output as at the below.

?firstDate=Today+is&secondDate=11/07/2014

Now I want to pass that 2 values to sDate & eDate. So what should I change in the SecondPage.html page?
Try this..

In example1.html:

a href="example2.html?myVar1=42&myVar2=66" >LINK
/a>


// Adapted from examples on the Querystring homepage.
var qs = new Querystring();
var v1 = qs.get("myVar1");
var v2 = qs.get("myVar2");
   
v2
Comments
Chiranthaka Sampath 10-Jul-14 4:47am
   
If I click the 'LINK' the values will be passed, is it so?
   
Comments
Chiranthaka Sampath 14-Jul-14 7:09am
   
Your help is appriciated pal, but this is not I wanted. Because I already done the passing as 'Peter Leow' saying in his solution. Now what I want is get the particular values from the URL i.e. startDate & endDate & pass them into 2 JavaScript Variables. Then how am I supossed to do that?
super simple...

to pass parameter
(page 1)
JavaScript
let urlParams = new URLSearchParams(window.location.search);
window.open('url' + urlParams);

to receive parameter
(page 2)
JavaScript
let myParamVar = urlParams.get('myParam');

(let is basically a better version of var):
then use:
JavaScript
let bod = document.getElementByTagName('body')[0];
bod.onload = function();

function([optional params]) {

    //do something here

}

How'd it work?
   
v2
Comments
Richard Deeming 20-Sep-18 9:30am
   
The URLSearchParams object was not supported in any major browser at the time this question was posted.

Chrome and Firefox added support in 2016; Safari in 2017; and Edge in 2018. Internet Explorer still doesn't support the API.

Aside from that, using the querystring was already suggested in the accepted solution.
<html>
<head>
<title>Solution</title>
</head>
<body>
<form action = "" name = "myForm" onsubmit = "aa();">
Name ::
<input type="text"name="fname"><br>
Email::
<input type="text"name="email">
<input type = "submit" value = "Submit" />
</form>
<script>

function aa()
{
var value1=document.myForm.fname.value;
var value2=document.myForm.email.value;
var queryString = "?para1=" + value1 + "¶2=" + value2;
window.open("page2.html" + queryString);
}
</script> 
</body>
</html>



Page 2
<html>
<head>
<title>value</title>
</head>
<body>
<h4>From page1.html.</h4>
<script>
 
var queryString = decodeURIComponent(window.location.search);
queryString = queryString.substring(1);
var queries = queryString.split("&");
for (var i = 0; i < queries.length; i++)
{
  document.write(queries[i] + "<br>");
}
 
</script> 
</body>
</html>
   
v2
Comments
CHill60 10-Jul-20 6:57am
   
An uncommented code dump is not a solution!
Member 14886040 10-Jul-20 8:01am
   
Basic code does not required comments

CHill60 10-Jul-20 8:33am
   
Ok. A code dump is not a solution. Explain why your solution is better than / different from the other solutions that were posted years ago.
By the way, even "basic" code does require commenting, especially if you are trying to explain to someone how to do something

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900