can't reference the input element properly
emekadavid
the
var textBox refuses to reference the input element with name
as where.
the html code is
<form name="which" action="">
<input type="text" size="60" name="where">
</form>
the accompanying javascript code is:
<script type="text/javascript" language="JavaScript"><!-- Begin
var isReady= false;
var textBox = document.which.where.value;
textBox = " ";
function showAddress(What){
//if the isReady variable is true
if (isReady){
//change the value of the textbox to the argument returned
textBox = What;
//give the input textbox focus and select it
document.which.where.focus();
document.which.where.select();
}
//else if isReady state is false, throw alert
else {
alert("This page is not fully loaded yet." + "\n" +
"Please wait for the page to finish laoding.");
}
}
//-->
</script>
--
ich bin ein berliner
Erwin Moller
> What is the source of the error for this code please: I don't know why
> the
> var textBox refuses to reference the input element with name
>
> as where.
>
> the html code is
>
> <form name="which" action="">
>
> <input type="text" size="60" name="where">
>
> </form>
>
> the accompanying javascript code is:
>
> <script type="text/javascript" language="JavaScript"><!-- Begin
<script type="text/javascript">
will do just fine. ;-)
Don't use the language, and also not the ancient <!--
>
> var isReady= false;
>
> var textBox = document.which.where.value;
That is wrong.
It should be:
var textBox = document.forms.which.where.value;
[didn't check the rest of the code]
Regards,
Erwin Moller
--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare
Matt Kruse
> What is the source of the error for this code please: I don't know why
> the
> var textBox refuses to reference the input element with name
> as where.
http://www.javascripttoolbox.com/bestpractices/#forms
Matt Kruse
Garrett Smith
> emekadavid schreef:
>> What is the source of the error for this code please: I don't know why
>> the
>> var textBox refuses to reference the input element with name
>>
>> as where.
>>
>> the html code is
>>
>> <form name="which" action="">
>>
>> <input type="text" size="60" name="where">
>>
>> </form>
>>
>> the accompanying javascript code is:
>>
>> <script type="text/javascript" language="JavaScript"><!-- Begin
>
> <script type="text/javascript">
> will do just fine. ;-)
>
> Don't use the language, and also not the ancient <!--
>
>
>>
>> var isReady= false;
>>
>> var textBox = document.which.where.value;
>
> That is wrong.
> It should be:
> var textBox = document.forms.which.where.value;
>
the form control directly from the form is nonstandard and has a nasty
side effect. That side effect is a memory leak.
The leak is seen after accessing the control by name/id from the form
directly, the property name will remain on the form and will continue to
point to the control, even if the control is removed from the dom.
Instead, use the standard - elements - collection to access the control.
var textBox = document.forms.which.elements.where.value;
--
Garrett
comp.lang.javascript FAQ: http://jibbering.com/faq/
GTalbot
> What is the source of the error for this code please: I don't know why
> the
> var textBox refuses to reference the input element with name
>
> as where.
>
> the html code is
>
> <form name="which" action="">
>
> <input type="text" size="60" name="where">
Right here, you can improve your code in 2 ways. Wrapping that input
in a <p> (best forward-compliance: required when using strict DTD) and
giving a better descriptive name to that input. So, e.g.:
<form name="subscribe" action="">
<p><label>City: <input type="text" size="60" name="city"></label></p>
<p><input type="submit"> Submit your form</p>
</form>
> the accompanying javascript code is:
>
> <script type="text/javascript" language="JavaScript"><!-- Begin
>
Like everyone said, remove
language="JavaScript"
and remove
<!-- Begin
> var isReady= false;
>
> var textBox = document.which.where.value;
The document must be fully loaded and the user must have already
filled in the form control to do this. textBox in your code is a
global variable... not just any variable.
>
> textBox = " ";
>
If you are going to declare a variable, then best is to always give it
a meaningful name, intuitive name, self-explanatory name. It helps in
all sorts of ways and in the long term to adopt such coding habit.
Here, I would choose
var textBoxValue = document.which.where.value;
or you could go with
var textBox = document.which.where;
As others replied, best web standards form is
var textBox = document.forms["which"].elements["where"];
and this issue was covered by the comp.lang.javascript faq:
8.1 How do I get the value of a form control?
http://jibbering.com/faq/#formControlAccess
and by
Accessing Elements with the W3C DOM
https://developer.mozilla.org/en/Using_Web_Standards_in_your_Web_Pages/Using_the_W3C_DOM#Accessing_Elements_with_the_W3C_DOM
and also by Matt Kruse's Javascript best practices
http://www.javascripttoolbox.com/bestpractices/#forms
> function showAddress(What){
>
> //if the isReady variable is true
>
> if (isReady){
You set isReady to false; how will it be updated? Your code excerpt
does not indicate this...
>
> //change the value of the textbox to the argument returned
>
> textBox = What;
>
> //give the input textbox focus and select it
>
> document.which.where.focus();
>
> document.which.where.select();
>
focus() and select() are most likely part of a form validation process
where the user must re-edit such form control. So, here, you would
usually have an alert or some kind of output saying: "Your entry is
incorrect. Please review that entry." or something like that ... but
your code does not indicate any of this.
> }
>
> //else if isReady state is false, throw alert
>
> else {
>
> alert("This page is not fully loaded yet." + "\n" +
>
> "Please wait for the page to finish laoding.");
>
> }
> }
>
> //-->
Like everyone else replied, remove
//-->
as this is no longer required.
regards, Gérard
kangax
I noticed the leak, but it seems to happen when accessing controls via
`elements` collection too �
<http://yura.thinkweb2.com/jstests/form_controls_leak.html>
I see Firefox memory continuously go up independent of whether I access
elements in a non-standard way, or via `elements` (in FF3.5, 3.6 or 3.7
on Mac OSX).
--
kangax