I recently discovered a JavaScript implementation flaw in Microsoft IE while trying to build dynamic form. I realize that Microsoft IE v 6.0.29 does not implement the getElementsByName(param) properly according to the W3C standard.
01 <html>
02 <script>
03 function validateFormFields(aForm) {
04 var elems = document.getElementsByName("field1");
05 alert("There are " + elems.length + " elements");
06 return false;
07 }
08 </script>
09 <body>
10 <form name="myForm" action="addData.do" method="post"
11 onsubmit="return validateFormFields(this)">
12 <div id="field1">
13 <input name="field1" type="text" value="cool"/>
14 </div>
15 <input type="submit" value="Submit"/>
16 </form>
17
18 </body>
19 </html>
20
From the codes sample above, I expect the browser to render the page by displaying an input field and a submit button. When submit button is clicked, it will invoke the validateFormFields() function, and this function is responsible to alert the number of elements that is returned by the document.getElementByName(“field1”).
"Retrieves a collection of objects based on the value of the NAME attribute"
Ok, it is something that I want. But then when I read further, I also found the following sentences:
There the main issue is documented. Not only that IE returned elements that have a "name" attribute that matches the value of the param, but it aslo retuned elements that have an "id" attribute that matches the value of the param. That's why the browser returned 2 elements where the first element comes from line 12 and the second element is from line 13.
I found the following explanation of the method from the W3C website:
"With [HTML 4.01] documents, this method returns the (possibly empty) collection of elements whose name value is given by elementName. In [XHTML 1.0] documents, this methods only return the (possibly empty) collection of form controls with matching name. This method is case sensitive"
No comments:
Post a Comment