/    Sign up×
Community /Pin to ProfileBookmark

global variables not getting recognized on page onload

Copy linkTweet thisAlerts:
Apr 27.2005

I have a page onload function that needs to read the values from a global variable, but unfortunately the formselements are undefined at page onload.
The page fails to execute the function due to var value being null/undefined.. What is the best way around that???

At page load, I get an error message pointing to the variable definition below saying the “forms.1.store_id is null or not an object”.. If I move the assignment within the function setFocus(), then it is able to recognize the the value, but then I lose the global functionality of it, which I need to be able to refresh and refocus my page..

Please help..Ros

<Script>

var stored=document.forms[1].store_id.value;

function setFocus(){
…
}
….
</Script>

<body onload=”setFocus()”>
…
</body>

to post a comment
JavaScript

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@7studApr 27.2005 — Your page is parsed sequentially from the top down, so this is what happens:

Step 1:

var stored=document.forms[1].store_id.value;

The <body> tag has not been encountered yet, and therefore no html elements exist, so undefined is assigned to 'stored'.

Step 2:

function setFocus(){...}

js parses the function and continues.

Step3:

<body onload ="setFocus()">

js assigns the onload event handler to the body tag and begins loading the html.

Step4:

</body>

js finishes loading the html, and the onload event handler fires, which calls your function, and the function refers to a variable whose value is undefined.

(disclaimer: the parsing process doesn't actually happen quite like that, but as far as you are concerned that's accurate enough.)
Copy linkTweet thisAlerts:
@7studApr 27.2005 — Steps to take to get your script to work:

1) Never put an onload event in the <body> tag.

2) Instead use:
[CODE]window.onload=function()
{


};
[/CODE]
and place that between some script tags in the <head>. Anything you want to happen onload, put the code between the braces. Specifically, you have to put any references to html elements in there. As you probably realize, that creates a problem: if you assign a value to 'stored' inside those braces, it won't be global, and if you put it outside the braces, it will be undefined--like it is now--because no html elements exist when the statement is executed.

There are two solutions to that problem:

1) You can declare the variable outside the function, and assign it inside the function:
[CODE]var stored;
window.onload=function()
{
stored = .....;

};[/CODE]

2) Create a global variable from inside the function:
[CODE]window.onload=function()
{
window["stored"] = ....;

};[/CODE]
Copy linkTweet thisAlerts:
@RosTNauthorApr 28.2005 — Great explanation. I followed your suggestion and had my variable problem resolved, however, I am still unable to hold the value of stored variable for a refresh of the page. How can I tackle that problem?

I need to be able to refresh the page and refocus it. I assign the value of the focus field to a hidden input field on the form, then I submit the form. After submission, the value of stored is reset back to the default value of "".


Here is the code:



<head>

<script>

<!--

var stored;

window.onload=function()

{

stored=document.form[1].store_id.value;

setFocus();

};


function setFocus()

{

if(stored != "")

{

eval("document.forms[0]."+stored+".focus()");

}

else

{

document.forms[0].cname.focus();

}

}

function lastFocused(elmId)

{

document.frmrefresh.store_id.value = elmId;

}

</head>

<body>

...

<form ...

<SELECT NAME="office" id="office" onfocus="lastFocused(this.id);" onblur=frmrefresh.submit();'>

... </SELECT>

</form>

<form name="frmrefresh" method="post" action="...">

<input name="store_id" type="hidden" value="">

</form>

</body>
×

Success!

Help @RosTN spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...