Global variable in javascript (declare it from one file, put value from another file and accessing it from some another file)

Question

I declared javascript global variable in global.js file eg:

var glbValue;

and putting the value of global variable glbValue from first.html eg:

<script type="text/javascript" src="global.js"></script>
<script type="text/javascript">
function onBtnSubmit()
{
   glbValue=123;
}
</script>

and accessing the global variable glbValue from second.html eg:

<script type="text/javascript" src="global.js"></script>
<script type="text/javascript">
function onBtnClick()
{
   alert(glbValue);
}
</script>

it gives me output undefined inplace of 123, why ?

the browser doesn't know that there is a variable called gbValue with value 123 when it loads second.html. are you loading first.html and then loading second.html within first.html? — anurupr
– anurupr, Commented Mar 18, 2014 at 8:48
What are you expecting then? global.js is loaded for both the html files and value gets reset. — Ankit Jaiswal
– Ankit Jaiswal, Commented Mar 18, 2014 at 8:48
P.S reference to the first page will not be available in the second page. So the value you assigned wont be there in the second page. — Subash Selvaraj
– Subash Selvaraj, Commented Mar 18, 2014 at 8:49
You need to use cookies in case you wish to share a variable between pages — SajithNair
– SajithNair, Commented Mar 18, 2014 at 8:52
@anurupr yes first i load first.html and onsubmit on it i will navigate to second.html — Gaurav Mahajan
– Gaurav Mahajan, Commented Mar 18, 2014 at 8:55

R3tep · Accepted Answer · 2014-03-18 08:55:51Z

2

Try to use the local storage :

first.html :

localStorage.setItem("glbValue", "123");

second.html :

alert(localStorage.getItem("glbValue"));

answered Mar 18, 2014 at 8:55

R3tep

12.9k10 gold badges52 silver badges77 bronze badges

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

Comments

Oscar Paz · Accepted Answer · 2014-03-18 08:59:27Z

When a page loads, all its script files are executed in a new context. The browser does not 'remember' what you did in the last page. If you want to share a variable between pages, either you use cookies or, even better, localStorage or sessionStorage.

Use localStorage if you want the value to be preserverd even when you close the browswer.
Use sessionStorage if you want the value to be preserved only during the current session.

I think that the 2º solution is the best in your case:

first.html:

<script type="text/javascript">
function onBtnSubmit()
{
   sessionStorage.setItem('gblValue', 123);
}
</script>

second.html

<script type="text/javascript">
function onBtnClick()
{
   alert(sessionStorage.getItem('gblValue'));
}
</script>

You no longer need that global variable. The only problem with this solution is that IE8 and below do not support this, but there are good polyfills that use cookies transparently.

Collectives™ on Stack Overflow

Global variable in javascript (declare it from one file, put value from another file and accessing it from some another file)

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related