Keep getting undefined variable error

[Chuck]

Hi!

Any ideas as to how I can get ride of the script error undefined
variable "Exp_Month"?

I am trying to get this drop down list to default to the current month
as opposed to 01.

Thank you in advance.

<SELECT size="1" name="Exp_Month">
<OPTION value="01" selected>1</OPTION>
<OPTION value="02">2</OPTION>
<OPTION value="03">3</OPTION>
<OPTION value="04">4</OPTION>
<OPTION value="05">5</OPTION>
<OPTION value="06">6</OPTION>
<OPTION value="07">7</OPTION>
<OPTION value="08">8</OPTION>
<OPTION value="09">9</OPTION>
<OPTION value="10">10</OPTION>
<OPTION value="11">11</OPTION>
<OPTION value="12">12</OPTION>
</SELECT>

<script type="text/javascript">
var now = new Date()
Exp_Month.selectedIndex = now.getMonth()
</script>

 

[LJL]

(e-mail address removed) (Chuck) wrote in

<SELECT size="1" name="Exp_Month">
<OPTION value="01" selected>1</OPTION>
<OPTION value="02">2</OPTION>
<OPTION value="03">3</OPTION>
<OPTION value="04">4</OPTION>
<OPTION value="05">5</OPTION>
<OPTION value="06">6</OPTION>
<OPTION value="07">7</OPTION>
<OPTION value="08">8</OPTION>
<OPTION value="09">9</OPTION>
<OPTION value="10">10</OPTION>
<OPTION value="11">11</OPTION>
<OPTION value="12">12</OPTION>
</SELECT>

<script type="text/javascript">
var now = new Date()
Exp_Month.selectedIndex = now.getMonth()
</script>

The easiest way I have found, is to change the script to:

<script type="text/javascript">
var now = new Date();
document.getElementById('Exp_Month').selectedIndex = now.getMonth();
</script>


Alternatively, name the form. If named "form_name", call the element by:

document.form_name.Exp_Month. selectedIndex = now.getMonth();

One last thing, which you probably know . . .
Be aware that months are zero-based, January is zero, Februaryis one,
etc. So calling the element's selectedIndex works, because the options are
zero-based liked the months. However, your values are 1-12. If you plan
to use the element's values, you may want to renumber them 0-11.
It only makes a difference if you are going to use the value
information for some month-related/date related script function in the
future.

Good luck,
LJL

 

[Michael Winter]

[snip]

The easiest way I have found, is to change the script to:

<script type="text/javascript">
var now = new Date();
document.getElementById('Exp_Month').selectedIndex = now.getMonth();

I beg your pardon? You cannot use document.getElementById with a named
element. Yes, it works in IE, but it won't work in all the other browsers.
document.getElementById should be used with ID'd elements. If you want to
get a named element using the DOM, use document.getElementsByName.

If you are trying to access a named element within a form, use[1]:

document.formName.Exp_Month.selectedIndex

If you don't use a form, ID the select element.

Be aware that the DOM is not supported well (or at all) by all browsers.
You should use feature detection to determine support for a particular
method. The example below assumes you ID'd the element, Exp_Month.

var expMonth = null;

if( document.getElementById ) {
expMonth = document.getElementById( 'Exp_Month' );
} else if( document.all ) {
expMonth = document.all[ 'Exp_Month' ];
}

expMonth.selectedIndex = .....

[snip]

Mike


[1] You can also use a collection-oriented accessor method. It is slightly
slower and more to type, but can be used to access ID'd elements, and
elements with names that include characters that are interpreted as
operators in JavaScript (+, -, [, ], *, etc). The same expression would be
written as:

document.forms['formName'].elements['Exp_Month'].selectedIndex

 

[Michael Winter]

On Mon, 09 Feb 2004 08:44:58 GMT, Michael Winter

[snip]

var expMonth = null;

if( document.getElementById ) {
expMonth = document.getElementById( 'Exp_Month' );
} else if( document.all ) {
expMonth = document.all[ 'Exp_Month' ];
}

expMonth.selectedIndex = ...

This example should end

if( expMonth ) {
expMonth.selectedIndex = ...
}

[snip]

Mike

 

[Bas Cost Budde]

[snip]

The easiest way I have found, is to change the script to:

<script type="text/javascript">
var now = new Date();
document.getElementById('Exp_Month').selectedIndex = now.getMonth();

I beg your pardon? You cannot use document.getElementById with a named
element. Yes, it works in IE, but it won't work in all the other
browsers. document.getElementById should be used with ID'd elements. If
you want to get a named element using the DOM, use
document.getElementsByName.

Well, since the name attribute is deprecated anyway, it is probably best
to switch to the id attribute. Or, include both, with the same value.

Recently I read that IE indeed allows element reference by id (no, that
should be: name) immediately, but that makes for hard readable code
unless you are well versed in the document structure. Therefore I think
document.getElementById is the better way. I wish they'd chosen a
shorter spelling...

Be aware that the DOM is not supported well (or at all) by all browsers.
You should use feature detection to determine support for a particular
method.

I agree.

 

[Richard Cornford]

document.formName.Exp_Month.selectedIndex

[1] You can also use a collection-oriented accessor method. It is
slightly slower and more to type, but can be used to access ID'd
elements, and elements with names that include characters that
are interpreted as operators in JavaScript (+, -, [, ], *, etc).
The same expression would be written as:

document.forms['formName'].elements['Exp_Month'].selectedIndex

It is not the use of the collections that allows the "illegal"
characters to be used in javascript property accessors it is the square
bracket notation that makes it possible. The property names of an (any)
object are unrestricted by ECMA 262 (probably there are implementation
imposed limits, such as total property name length). It is the dot
notation accessors that impose a restriction on the names used because
the items between the dots must conform to the production rules for an
identifier.

As the two forms of property accessor syntax are equivalent (in terms of
how they work) it is possible to use square bracket notation wherever
dot notation is used, so the above shortcut form accessor could be any
of (and more):-

document["formName"].Exp_Month.selectedIndex
document.formName["Exp_Month"].selectedIndex
document["formName"]["Exp_Month"].selectedIndex
document["formName"]["Exp_Month"]["selectedIndex"]
window["document"]["formName"]["Exp_Month"]["selectedIndex"]

- and the strings used in the bracket notation can hold any character
sequence.

Similarly the collections based assessors could use dot notation
(assuming the names/IDs conformed with the identifier rules):-

document.forms.formName.elements.Exp_Month.selectedIndex

The reason that I use the longer collections based accessors with the
form and control names in bracket notation is for the clarity it
provides in the source code. The collections access leaves a reader of
the code in no doubt that the subject of the accessor is a control
within a form (as they can clearly read "forms" and "elements" in the
accessor). And the use of bracket notation in that context separates the
HTML namespace from the javascript namespace.

Speed of resolution of the longer accessors is not usually an issue as I
would assign a reference to the - elements - collection to a local
variable anyway:-

var els = document.forms['formName'].elements;

- and then refer to the controls relative to that, so most of the work
resolving the form accessors is only done once. (it also makes the
amount of extra typing involved when using the longer form
insignificant)

Richard.

 

[Lasse Reichstein Nielsen]

Well, since the name attribute is deprecated anyway, it is probably
best to switch to the id attribute.

It is not deprecated on form controls. The example that is currently
discussed is for a select element, i.e., a form control (if inside
a form, at least).

Or, include both, with the same value.

When used on form controls, name and id values doesn't have to be
identical. The id value gives the anchor name of the object, the name
value gives the control name (the one that is used when the form is
submitted).

/L

 

[Michael Winter]

document.formName.Exp_Month.selectedIndex

[1] You can also use a collection-oriented accessor method. It is
slightly slower and more to type, but can be used to access ID'd
elements, and elements with names that include characters that
are interpreted as operators in JavaScript (+, -, [, ], *, etc).
The same expression would be written as:

document.forms['formName'].elements['Exp_Month'].selectedIndex

It is not the use of the collections that allows the "illegal"
characters to be used in javascript property accessors it is the square
bracket notation that makes it possible.

I didn't say that, nor did I (intend to) imply it.

[snip]

document["formName"].Exp_Month.selectedIndex
document.formName["Exp_Month"].selectedIndex
document["formName"]["Exp_Month"].selectedIndex
document["formName"]["Exp_Month"]["selectedIndex"]
window["document"]["formName"]["Exp_Month"]["selectedIndex"]

- and the strings used in the bracket notation can hold any character
sequence.

Similarly the collections based assessors could use dot notation
(assuming the names/IDs conformed with the identifier rules):-

document.forms.formName.elements.Exp_Month.selectedIndex

I've seen collections accessed like that, but it's usually been in badly
written, IE-only scripts so I've always ignored it. I never realised that
the bracket- and dot-notations were quite so interchangable.

Mike

 

[LJL]

I beg your pardon? You cannot use document.getElementById with a named
element. Yes, it works in IE, but it won't work in all the other
browsers. document.getElementById should be used with ID'd elements.
If you want to get a named element using the DOM, use
document.getElementsByName.

[snip]

Mike

You're absolutely right. My apologies. I had added the ID tag to my test
bed when I tried the mod to make sure it worked. I forgot completely about
having done so when I sent my reply to the original post.

Thanks for pointing out my shortfall.

LJL

 

[Bas Cost Budde]

It is not deprecated on form controls.

You're right.

When used on form controls, name and id values doesn't have to be
identical. The id value gives the anchor name of the object, the name
value gives the control name (the one that is used when the form is
submitted).

Thanks. I had trouble using getElementById in IE since that also
returned matches on the name attribute, but I probably gave up on the
whole name attribute too early.