Results 1 to 4 of 4

Thread: How to re-arrange DOM after inserting some extra elements of form via innerHTML ?

  1. #1
    Join Date
    Aug 2006
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Exclamation How to re-arrange DOM after inserting some extra elements of form via innerHTML ?

    Hello,

    I have an HTML page. which contain a form. but according to requirements (user selections of SELECT control ), I am inserting some more elements to form by innerHTML.

    But problem is DOM doesnt entertain newly inserted element.

    e.g. document.forms[0].my_new_inserted_element.value // Returns undefined or Object error.

    It's problem of Firefox and Opera. In I.E. its working nicely.

    And createTextNode & appendChild is to lengthy procedue for me to insert elements & setting it's property.

    Is there any way?, After insering new elements into FORM via innerHTML , we can re-arrange the DOM. So, that firefox & opera consider newly inserted elements for javascript validation ????

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Most likely, if you inserted valid innerHTML into a valid location on the page to begin with, this wouldn't be a problem. It is very tricky though, especially with forms, to do this in a valid manner, perhaps impossible in some cases. Using the DOM to go back and 'repair' a mistake made using innerHTML is silly though. It could not possibly take that much more code to insert the new content properly using the DOM in the first place.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Sep 2005
    Posts
    882
    Thanks
    0
    Thanked 3 Times in 3 Posts

    Default

    Furthermore, Konqueror does not like innerHTML. Technically, it supports it, but in my experience it is very buggy. My advice is to just avoid the use of innerHTML

  4. #4
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    e.g. document.forms[0].my_new_inserted_element.value // Returns undefined or Object error.
    For a start, you should be using the elements collection:
    Code:
    document.forms[0].elements.my_new_inserted_element.value
    Secondly, I don't know if this is what you've run into here or not, but you've set yourself up to be bitten by the most common innerHTML problem in the book: it clears all non-serialised data, and that includes form values. Thus, when you add an element to the form using the select, the select will immediately be not only reset to its default value, but actually destroyed and created anew, as will all the other form elements -- which will likely result in the required removal of the new element.

    As jscheuer1 and blm126 have said, stay away from innerHTML -- especially where forms are involved.
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •