|
|
Posted by Thomas 'PointedEars' Lahn on 11/29/05 18:32
Sathyaish wrote:
> (1) Can two HTML controls have the same name? It looks like the obvious
> answer is NO.
No, the answer is YES, of course! For example, there would be no way
to implement radio buttons if it was NO.
> (2) What if? What if the developer has given two HTML controls the same
> name, i.e has created the same button more than once with exactly the
> same name and all other attributes? What happens then?
Then all controls with the same name, as all elements with the same
name, become part of a NodeList collection where each element can be
referred to by zero-based index.
> [...]
> <HTML>
>
> <SCRIPT>
That is not Valid (X)HTML. <URL:http://validator.w3.org/>
> function doFoo()
> {
> document.forms[0].edt.disabled=!document.forms[0].edt.disabled;
Should be at least
var es = document.forms[0].elements, edt0;
if (((edt0 = es['edt'][0]).disabled = !es['edt'][1].disabled))
{
edt0.disabled = !es['edt'][1].disabled ? "disabled" : "";
}
> }
> </SCRIPT>
>
> <FORM name="frmFoo">
> <INPUT type="button" value="Edit" name="edt" onClick="return doFoo()"/>
> <INPUT type="button" value="Edit" name="edt" onClick="return doFoo()"/>
> </FORM>
It is not necessary to refer to the form by index/name or to the event
target by name. Use `this' within intrinsic event handler attribute
values to refer to the event target and use `this.form' (or the
equivalent in the called method) to refer to the ancestor `form'
element.
> Like I expected, clicking any of the buttons did not disable either of
> them.
Because you referred to the wrong object. The same-named elements were in a
collection, and the collection itself had no `disabled' property before you
added one. Of course the user-defined property, if it was even created,
did not change presentation of the respective elements.
> So, I wanted to do something like this:
>
>
> For Each HTML Control In The Form On The Document
> If The HTML Control Has a Value Of Edit Then
> Disable It, or do something with it like show me its name and
> value
> End If
> Next HTML Control
// For Each HTML Control In The Form On The Document
var f = referenceToFormOnTheDocument;
for (var es = f.elements, i = es.length; i--;)
{
var e = es[i];
if (e.value == "Edit")
{
// Disable It,
if ((e.disabled = false))
{
e.disabled = "disabled";
}
// or do something with it like show me its name and value
alert([e.name, " = ", e.value].join(""));
// End If
}
// Next HTML Control
}
> [...]
> <HTML>
>
> <SCRIPT>
That's not Valid (X)HTML either.
> function doFoo()
> {
> alert(document.forms[0].children.length)
`children' is a non-standard property of the IE-DOM. You are looking for
the both standards compliant and downwards compatible `elements' property
instead which includes all form controls, rather than the standard
equivalent to `children' of `childNodes' which would include all child
elements as well.
> for(i=0; i<=document.forms[0].children.length-1; i++)
for (var i = 0, len = document.forms[0].children.length; i < len; i++)
> {
> alert(document.forms[0].children[i].name)
> if (document.forms[0].children[i].value == 'Edit')
> document.forms[0].children[i].disabled=false;
> }
> }
>
> </SCRIPT>
>
> <FORM name="frmFoo">
> <INPUT type="button" value="Edit" name="edt" onClick="return doFoo()"/>
> <INPUT type="button" value="Edit" name="edt" onClick="return doFoo()"/>
^[1]
> </FORM>
>
> </HTML>
>
>
> And lo! as I expected, the form has just one element reference that is
> valid and the other as an invalid reference.
That is probably because you referred to all the child nodes of
the element instead of to all form control child element nodes.
> [...]
> I am running IE 6 on Win 2000, if that is relevant.
Yes, IE does not support XHTML.[1]
<URL:http://hixie.ch/advocacy/xhtml>
HTH
PointedEars, X-Post & F'up2 comp.lang.javascript
Navigation:
[Reply to this message]
|