Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    May 2009
    Posts
    5
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Internet Explorer appendChild problem

    I am making a web page, and as part of it I have a table that the user can add rows to. My code works in FF and Chrome, but IE is broken.
    Code:
    function addrow() {
                  var example=document.getElementById("new");
                  var addHere=document.getElementById("ticketTable");
                  var node= example.cloneNode(true);
                  node.id="added";
                  addHere.appendChild(node);
              }
    This code is called when a button is clicked. new is the ID of the row I am adding, and ticketTable is the ID of the table I am adding to. Help please!

  • #2
    New Coder
    Join Date
    Jul 2010
    Posts
    61
    Thanks
    0
    Thanked 21 Times in 21 Posts
    Quote Originally Posted by Kenoshi View Post
    new is the ID of the row I am adding, and ticketTable is the ID of the table I am adding to.
    I suspect that I.E. would expect a row to be appended to a tbody element, not the table directly. Also you should add an incrementing numeric suffix to the ID attribute so that it cannot be duplicated.

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,965
    Thanks
    79
    Thanked 4,429 Times in 4,394 Posts
    I suspect that I.E. would expect a row to be appended to a tbody element, not the table directly.
    Most definitely.

    SO you can do:
    Code:
    var addCount = 0;
    function addrow() {
                  var example=document.getElementById("new");
                  var addHere=document.getElementById("ticketTable").getElementsByTagName("tbody")[0];
                  var node= example.cloneNode(true);
                  node.id="added" + (++addCount);
                  addHere.appendChild(node);
              }
    This does work in other browsers, so you don't have to do browser detection.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


  •  

    Posting Permissions

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