By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,574 Members | 2,960 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,574 IT Pros & Developers. It's quick & easy.

how to access form elements with numbers as names

P: n/a
Hi,

I have inherited some code that has some form elements (radio buttons)
that are called "1", "2" etc.

for example:

<input name="2" type="radio" value="45">
<input name="2" type="radio" value="46">
I want to be able to access them through javascript to disable them;

forms.myform.2[0].disabled=true;

etc.
however I get a javascript error when I try to do this (something about a
missing semicolon).
My javascript skills are fine and I have other elements being disabled OK,
so I assume that this is a problem with the way that the elements were
named.

Unfortunately I don't have the option of renaming the elements. Is there
another way to access these elements?
I have tried:

var temp=forms.myform.2;
temp[0].disabled=true;

But I get the same missing semicolon error on the "var temp=..." line

Any thoughts appreciated!

Cheers,

Ben
Sep 14 '05 #1
Share this Question
Share on Google+
11 Replies


P: n/a
Jon Hoowes wrote:
Hi,

I have inherited some code that has some form elements (radio buttons)
that are called "1", "2" etc.

for example:

<input name="2" type="radio" value="45">
<input name="2" type="radio" value="46">
I want to be able to access them through javascript to disable them;

forms.myform.2[0].disabled=true;

etc.
however I get a javascript error when I try to do this (something about a
missing semicolon).
My javascript skills are fine and I have other elements being disabled OK,
so I assume that this is a problem with the way that the elements were
named.

Unfortunately I don't have the option of renaming the elements. Is there
another way to access these elements?
I have tried:

var temp=forms.myform.2;
temp[0].disabled=true;

But I get the same missing semicolon error on the "var temp=..." line

Any thoughts appreciated!

Cheers,

Ben


Hi Ben,

Maybe stringnotation helps? (not sure)

var temp=forms.myform["2"];
temp[0].disabled=true;

If not, try debugging by using alert.
Like:
var temp=forms.myform["2"];
alert (tmp);
temp[0].disabled=true;

is tmp pointing to a radio-object?

And yes: Strange design to name your elements like that. :-/

Regards,
Erwin Moller
Sep 14 '05 #2

P: n/a
Hi Ben,

Maybe stringnotation helps? (not sure)

var temp=forms.myform["2"];
temp[0].disabled=true;

If not, try debugging by using alert.
Like:
var temp=forms.myform["2"];
alert (tmp);
temp[0].disabled=true;

is tmp pointing to a radio-object?

And yes: Strange design to name your elements like that. :-/

Regards,
Erwin Moller


One more thing, I always use document too before adressing elements.
So:
var temp=document.forms.myform["2"];

Regards,
Erwin Moller
Sep 14 '05 #3

P: n/a
Maybe stringnotation helps? (not sure)

var temp=forms.myform["2"];
temp[0].disabled=true;
This works, but doesn't allow me to access the elements by their "name"
And yes: Strange design to name your elements like that. :-/


It's a system that builds a form based on database information. The
primary key, which is a number, determines the name of the element.

This is also why the suggestion you made is not suitable - it works, but I
cannot guarantee the order of each element within the form :(

Cheers anyway!

Jon
Sep 14 '05 #4

P: n/a
Jon Hoowes wrote:
I have inherited some code that has some form elements (radio buttons)
that are called "1", "2" etc.


The core problem is the fact that form element names cannot begin with a
number.
It's invalid HTML.
Therefore, your javascript cannot be expected to work.

You must rename the form elements.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Sep 14 '05 #5

P: n/a

"Jon Hoowes" <ju*****@hotmail.com> wrote in message
news:pa****************************@hotmail.com...
Maybe stringnotation helps? (not sure)

var temp=forms.myform["2"];
temp[0].disabled=true;


This works, but doesn't allow me to access the elements by their "name"
And yes: Strange design to name your elements like that. :-/


It's a system that builds a form based on database information. The
primary key, which is a number, determines the name of the element.


make the name of the element up using a string AND the primary key. ie

"element" + primaryKey...
Sep 14 '05 #6

P: n/a
Matt Kruse wrote:
The core problem is the fact that form element names cannot begin with a
number.


NAME tokens cannot start with a number, but the value of the name attribute
is not a NAME token. Form control names may begin with a number.

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is
Sep 14 '05 #7

P: n/a
Lee
Jon Hoowes said:

Maybe stringnotation helps? (not sure)

var temp=forms.myform["2"];
temp[0].disabled=true;


This works, but doesn't allow me to access the elements by their "name"
And yes: Strange design to name your elements like that. :-/


It's a system that builds a form based on database information. The
primary key, which is a number, determines the name of the element.


It would be fine to allow the numeric key to *determine* the name
of the element, but it was a bad decision to allow the numeric key
to *be* the name of the element. Surely your developers can figure
out how to translate the key "2" into "element_2", or some other
valid name.

Sep 14 '05 #8

P: n/a
David Dorward wrote:
Matt Kruse wrote:

The core problem is the fact that form element names cannot begin with a
number.

NAME tokens cannot start with a number, but the value of the name attribute
is not a NAME token. Form control names may begin with a number.


Yes, the value of an HTML name attribute is CDATA. The ID attribute is
a NAME token and can't start with a number - easily confused!

Name:
<URL:http://www.w3.org/TR/html4/interact/forms.html#adef-name-INPUT>

ID:
<URL:http://www.w3.org/TR/html4/struct/global.html#adef-id>

--
Rob
Sep 15 '05 #9

P: n/a
> It would be fine to allow the numeric key to *determine* the name
of the element, but it was a bad decision to allow the numeric key
to *be* the name of the element. Surely your developers can figure
out how to translate the key "2" into "element_2", or some other
valid name.


I agree 100%, but I don't have any way to update the code that takes the
script - it is on a separate system and although I have asked them to
change it, I don't think they want to, hence wondering if there is anyway
to access the element without changing the element name...

Cheers,

Jon
Sep 15 '05 #10

P: n/a
Jon Hoowes wrote:
I agree 100%, but I don't have any way to update the code that takes
the script - it is on a separate system and although I have asked
them to change it, I don't think they want to, hence wondering if
there is anyway to access the element without changing the element
name...


Sorry for the mistake about the name not starting with a number. My bad! :)

An alternative - write a custom function which loops through all the form
elements, checking their .name property. When you find one that matches,
return it.

It wouldn't be super efficient, but it would probably do what you need.

--
Matt Kruse
http://www.JavascriptToolbox.com
http://www.AjaxToolbox.com
Sep 15 '05 #11

P: n/a
Jon Hoowes wrote:
Maybe stringnotation helps? (not sure)

var temp=forms.myform["2"];
temp[0].disabled=true;

This works, but doesn't allow me to access the elements by their "name"

And yes: Strange design to name your elements like that. :-/

It's a system that builds a form based on database information. The
primary key, which is a number, determines the name of the element.

This is also why the suggestion you made is not suitable - it works, but I
cannot guarantee the order of each element within the form :(


So let's get this straight. You have a form with some sets of radio
buttons. You are given a number from some other function that you then
want to use as the name of a group of radio buttons.

So you may have a form with:

<form name="formA" ...>
<br>
<input type="radio" name="1" ...>
<input type="radio" name="1" ...>
<br>
<input type="radio" name="2" ...>
<input type="radio" name="2" ...>
</form>

You are given an number, say '2', and you want to disable the radio
buttons belonging to that group.

JavaScript does automatic type conversion, it seems that when you try to
access the element using '2' as a name it is converted to a number,
making it very hard to use.

So use the auto-type conversion to your advantage using an 'if' and
iterate over all the inputs and disable any that have a name that
matches 2.

'if' will type convert too, so it will turn the number back into a
string if it needs to.

<script type="text/javascript">

// Just a dummy function to return a number
function getNumber()
{
return 2;
}

function disableButtons( f )
{
var nameToUse = getNumber();
var el, els = f.getElementsByTagName('input');
var i = els.length;
while ( i-- ) {
el = els[i]
if ( 'radio' == el.type && nameToUse == el.name ) {
el.disabled = true;
}
}
}
</script>

<form name="formA" ...>
<br>
<input type="radio" name="1" ...>
<input type="radio" name="1" ...>
<br>
<input type="radio" name="2" value="2-1">
<input type="radio" name="2" value="2-2">
<br>
<input type="button" value="disable set 2" onclick="
disableButtons(this.form);
">
<input type="reset">
</form>

--
Rob
Sep 15 '05 #12

This discussion thread is closed

Replies have been disabled for this discussion.