Click here to Skip to main content
14,450,027 members
Rate this:
Please Sign up or sign in to vote.
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 8-Feb-20 13:15pm
Comments
Peter Leow 10-Jul-14 8:19am
   
Just added response to your additional query.
Rate this:
Please Sign up or sign in to vote.

Solution 2

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?
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?
Rate this:
Please Sign up or sign in to vote.

Solution 1

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?
Rate this:
Please Sign up or sign in to vote.

Solution 4

   
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?
Rate this:
Please Sign up or sign in to vote.

Solution 5

super simple...

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

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

(let is basically a better version of var):
then use:
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.

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




CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100