Loading ...
Sorry, an error occurred while loading the content.

Re: [ydn-javascript] Re: Button question

Expand Messages
  • Jing Ceawlin
    Finally I find out the reason. According to the W3C documentation, the form element encompasses behavior similar to a collection and an element. It provides
    Message 1 of 4 , Jan 3, 2008
    • 0 Attachment
      Finally I find out the reason. According to the W3C documentation, the form element "encompasses behavior similar to a collection and an element. It provides direct access to the contained form controls as well as the attributes of the form element". Let's use an example to see what that means:
      ------------------------eg1----------------------------------------------
      <form id='form1'....>
      <span class="yui-button yui-reset-button" id="reset"><span class="first-child"><button type="button">Reset</button></span></span>
      </form>
      alert(document.getElementById('form1').length); // will show 1, because the form element "encompasses
                                                                           // behavior similar to a collection" and there is only one
                                                                           // form control here(the button)
      alert(document.getElementById('form1').reset) // shows that it is a fucntion, obviously
      ----------------------------------------------------------------------------


      ------------------------eg2----------------------------------------------------
      <form id='form1'....>
      <button type="button" id='reset'>Reset</button>
      </form>
      alert(document.getElementById('form1').length); // still 1
      alert(document.getElementById('form1').reset);  // This time it shows that reset is an element, the button.
                                                                           // Because button is a form control, and it has an id, then we can
                                                                           // access it directly through its container form. That's what the
                                                                           // W3C documentation says.
      ----------------------------------------------------------------------------------

      From the second example, we can see that if we have a form control with an id, and the id is the same as form's built-in attribute or function's name, then the built-in member got overridden. After a little more testing, turns out the name of form control could also override form's built-in member.

      There is one more thing. In the first example, the id is on the span element, and span is not a form control. So it can't override the form's reset function. But, what if the yui button is dynamic generated. Suppose that the original html goes like this:
      <form id='form1'....>
      <button type="button" id='reset'>Reset</button>
      </form>
      I don't if it's a bug of mozilla, but after the yui library change the html button to the yui button, the form collection doesn't update. So the reset function still get overridden. Both IE and Opera update. That's why the problem above only happens in Mozilla.



      On Jan 3, 2008 5:36 PM, dvidluca <dvidluca@...> wrote:

      Wow, thanks! That's fixed it


    Your message has been successfully submitted and would be delivered to recipients shortly.