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 12 of 12
  1. #1
    New Coder
    Join Date
    Mar 2003
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Internet Explorer Internet Explorer won't append table rows using appendChild

    Greetings, forumers,

    I've written a page in ASP which queries a db for results (blah, blah, blah), and the results are outputted to the page as they are retrieved.

    However, the crux of the problem is that I want to display a 'quicklink' (with just the name of the article and a supplier logo) in the table column that's rendered before the results are retrieved.

    I've written the following code, which works fantastically well in Mozilla / Phoenix, but IE rejects it.

    <script language="Javascript">
    var link = document.createElement('a');
    var span = document.createElement('span');
    var txt = "EPSON GPS Receiver Module S4E398600010000";
    var image = document.createElement('img');
    var tr = document.createElement('tr');
    var td = document.createElement('td');
    link.setAttribute('href','#1');
    span.setAttribute('class','editorialQuickLinkTitle');
    link.innerHTML = txt;
    span.appendChild(link);
    image.setAttribute('src','/Images/Logos/Miniatures/epson.png');
    image.setAttribute('border','0');
    image.setAttribute('vspace','5');
    image.setAttribute('hspace','5');
    td.setAttribute('class','block');
    td.appendChild(span);
    td.appendChild(document.createElement('br'));
    td.appendChild(image);
    tr.appendChild(td);
    document.getElementById('querySummary').appendChild(tr);
    </script>

    Anyone have any thoughts? I'd be happy to leave it as a Mozilla-only thing, but unfortunately most of the users of the site are IE lovers, and I would like to integrate the code into other portions of the site where it will be far more visible.

    Thanks for your thoughts (in advance )
    - Vlaad

  • #2
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Try creating a tfoot, thead or tbody to place the tr in, and it should work better.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #3
    New Coder
    Join Date
    Mar 2003
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thanks man...

    That did the trick - add in the <TBODY> tag to wrap the rows in, and it's all good

    Thanks heaps!
    - Vlaad

  • #4
    New Coder
    Join Date
    Mar 2003
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Internet Explorer Hmm... 1 more minor problem

    There seems to be just one more problem.

    Internet Explorer's not applying the styles I've specified to the cells.

    Again, there's no problem in Mozilla, but IE's causing me grief.

    I'd be guessing that it's not executing the setAttribute function correctly?
    - Vlaad

  • #5
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    setAttribute('class',[string classAttribute]) doesn't work in ie, because of the way ie maps elm.setAttribute(sName,sValue) to elm[sName]=sValue. Since class is a reserved keyword in JavaScript W3C mapped className instead of class to the class attribute.

    Thus, use elm.className=value; instead.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #6
    New Coder
    Join Date
    Mar 2003
    Posts
    24
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Ta

    Man... you're a freaking genius.

    Can't thank you enough for your help, Liorean!

    Where'd you learn such things???
    - Vlaad

  • #7
    Master Coder
    Join Date
    Feb 2003
    Location
    UmeŚ, Sweden
    Posts
    5,575
    Thanks
    0
    Thanked 83 Times in 74 Posts
    Been there, done that. And this. And thus I've learnt to cope with some of the quirks you encounter in various browsers.

    I've been working with javascript since nn2 introduced it in 1995 - I've had my chances to encounter this type of problem. I've read the specs and often revisit them. I follow disussions here, on evolt's [theList], on [wdf-dom], [wd-l], [css-d] and JS-Jive. Also, I keep up to date with for example PPK's DOM compatibility tables, do my own testing, and hear the news through a number of blogs.


    But, if you want to learn the quirks of various browsers, you must work with them. That's the only way to really learn.
    Last edited by liorean; 03-30-2003 at 05:02 PM.
    liorean <[lio@wg]>
    Articles: RegEx evolt wsabstract , Named Arguments
    Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs
    Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

  • #8
    New to the CF scene
    Join Date
    Apr 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Same Problem, No solution

    Hi, i'm having the same problem with the appendChild method... actually after I read your previous post, I've altered my function and it no longer gives an erro message. The problem is that it doesn't append the item to the page either. What I want to do is simply to get values from a form in a popup and sending them to the opener form while creating the fields in a table dinamically. with the code below You'll probably see the problem in a heartbeat...

    function cria(contador){
    var aux = opener.document.getElementById("databody")[0];

    var nome1 = "dado"+contador+"a";
    var nome2 = "dado"+contador+"b";
    var nome3 = "dado"+contador+"c";

    var corpo = document.createElement("TBODY");
    var row = document.createElement("TR");
    var td1 = document.createElement("TD");
    var td2 = document.createElement("TD");
    var td3 = document.createElement("TD");

    var in1 = document.createElement("input");
    in1.value = document.getElementById('dado1').value;
    in1.id = nome1;
    td1.appendChild(in1);

    var in2 = document.createElement("input");
    in2.value = document.getElementById('dado2').value;
    in2.id = nome2;
    td2.appendChild(in2);

    var in3 = document.createElement("input");
    in3.value = document.getElementById('dado3').value;
    in3.id = nome3;
    td3.appendChild(in3);

    corpo.appendChild(row)
    row.appendChild(td1);
    row.appendChild(td2);
    row.appendChild(td3);


    window.opener.document.getElementById("databody").appendChild(corpo);
    window.close();
    }

    The contador variable is a counter that I use to index the appended items.
    I would really apreciate if you could give a hand... as you can see i'm very unexperienced...

  • #9
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    if your root is on the opener, than try create elements as opener's elements as well. Try

    var corpo = opener.document.createElement("TBODY");
    var row = opener.document.createElement("TR");
    and so on...
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #10
    _Q_
    _Q_ is offline
    New Coder
    Join Date
    Jul 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hey liorean,

    I've just had exactly the same problem as Vlaad. Who'd have thought: TBody!

    Cheers, you saved my day.

  • #11
    New to the CF scene
    Join Date
    Jul 2005
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by _Q_
    Hey liorean,

    I've just had exactly the same problem as Vlaad. Who'd have thought: TBody!

    Cheers, you saved my day.
    Same here.

  • #12
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    if you would have the curiosity to alert a table's innerHTML, you should have noticed that the tbody is shown as a child node nomatter if it is really HTML written there or not. In fact it looks like tbody is a compulsory element of a table.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

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