Elements[ ] index property

[Steve Wylie]

What is the syntax for finding out the element index number from a
specific element on a form?

For example, if you do
OnClick="document.forms[0].elements[12].checked=true", then when that
element is clicked, whatever the twelfth element is on the form,
assuming it is a checkbox or radio, will become checked. But what
about if you wanted to do the reverse - to click on an element and
have an alert box tell you that you had just clicked on elements[12]
of the form? How do I extract the index number property of that
element?

Hope someone can advise.

Steve Wylie

 

[Martin Honnen]

What is the syntax for finding out the element index number from a
specific element on a form?

There is no "syntax" for that, nor is there a property or method defined
in the object model of current browsers as IE, Mozilla, or Opera.

But what
about if you wanted to do the reverse - to click on an element and
have an alert box tell you that you had just clicked on elements[12]
of the form? How do I extract the index number property of that
element?

You can write a function to do that
function getElementsIndex (element) {
if (element.form) {
for (var i = 0; i < element.form.elements.length; i++) {
if (element == element.form.elements) {
return i;
}
}
return -1; // <input type="image"> in some browsers
}
else {
return -1;
}
}

then
<input onclick="var index = getElementsIndex(this);" ...>

 

[Lee]

Steve Wylie said:

What is the syntax for finding out the element index number from a
specific element on a form?

For example, if you do
OnClick="document.forms[0].elements[12].checked=true", then when that
element is clicked, whatever the twelfth element is on the form,
assuming it is a checkbox or radio, will become checked. But what
about if you wanted to do the reverse - to click on an element and
have an alert box tell you that you had just clicked on elements[12]
of the form? How do I extract the index number property of that
element?

There's no simple syntax for that, because you almost never
need to know that. If you need a way to refer to a specific
element once you've found it, store a reference to it:

onclick="globalClickedElement=this"

If you really do need the number, then you loop through all
of the elements until you find the one that refers to the
same object as "this":

for(var i=0;i<document.forms[0].elements.length;i++){
if(this===document.forms[0].elements){
alert("You clicked element number "+i);
break;
}
}

 

[Steve Wylie]

Thank you Martin, it works a treat. Just what I wanted. Also, the
website address you quote under your name, JavaScript.FAQTs.com, looks
very interesting.

Steve Wylie

 

[Thomas 'PointedEars' Lahn]

For example, if you do
OnClick="document.forms[0].elements[12].checked=true", then when that
element is clicked, whatever the twelfth element is on the form,
assuming it is a checkbox or radio, will become checked.

No, it will happen to the thirteenth element (in order of appearance in
the source code).


PointedEars

 

[Steve Wylie]

Yes, it will too. Thank God it's only an example.

Steve