IE + XML + javascript = 0

Discussion in 'XML' started by milkyway, Dec 7, 2004.

  1. milkyway

    milkyway Guest

    Hello,

    Just new to all of this. The code below is supposed to load an XML file
    for use in a table. It doesn't work because of one command:

    table.insertRow command:

    I have seen the specs saying that it should be a -1 or the length of
    the table. I have tried.

    table.insertRow(-1) => error: Invalid Argument
    table.insertRow(table.rows.length-1) => error: Invalid Argument
    table.insertRow(0) => error: Invalid Argument

    I have incorporated ALL of the code below because I am at the end of my
    rope on this.

    Thanks to ANYONE who will help me with this.

    Regards.

    <html>

    <head>
    <meta name="GENERATOR" content="Microsoft FrontPage 5.0">
    <meta name="ProgId" content="FrontPage.Editor.Document">
    <meta http-equiv="Content-Type" content="text/html;
    charset=windows-1252">
    <title>Table Samples</title>


    <script>
    function findTable(id)
    {
    id = "#" + id;
    var tables = document.getElementsByTagName("table");
    var i;
    for (i=0; i < tables.length; i++) {
    var table = tables;
    if (table.getAttribute("datasrc") == id)
    return table;
    }
    return null;
    }


    function addRowDOM (tableID) {
    // pass every cell content as a futher arg
    alert("here");
    var table =
    document.all ? document.all[tableID] :
    document.getElementById(tableID);
    alert("here 2");
    if (arguments.length > 1) {
    alert(table.rows.length);
    var row = table.insertRow(table.rows.length-1);
    alert("after var");
    if (document.all) {
    alert("second if");
    for (var i = 1; i < arguments.length; i++) {
    alert("in the for loop");
    var cell = row.insertCell(i - 1);
    cell.innerHTML = arguments;
    }
    }
    else if (document.getElementById) {
    alert("in else");
    for (var i = arguments.length - 1; i >= 1; i--) {
    var cell = row.insertCell(arguments.length - 1 - i);
    cell.appendChild(document.createTextNode(arguments));
    }
    }
    }
    }


    function getDataFieldNames(table)
    {
    var array = new Array();
    var divs = table.getElementsByTagName("div");
    var i;
    for (i=0; i < divs.length; i++) {
    var div = divs;
    var datafld = div.getAttribute("datafld");
    if (datafld != null && datafld != "") {
    array = datafld;
    }
    }

    if (array.length < 1) {
    return null;
    }

    return array;
    }


    function getSrcFieldValues(xml, fieldNames)
    {
    var srcs = new Array();
    var i;
    for (i=0; i < fieldNames.length; i++) {
    var field = fieldNames;
    srcs[field] = xml.getElementsByTagName(field);
    }
    return srcs;
    }


    function fillTable(table, srcs)
    {
    var trtemplate =
    table.firstChild.removeChild(table.firstChild.firstChild);
    var tdtemplate = trtemplate.removeChild(trtemplate.firstChild);

    while (trtemplate.firstChild) {
    trtemplate.removeChild(trtemplate.firstChild);
    }

    table = table.firstChild;

    var cols = 0;
    for (field in srcs) {
    srcs[cols++] = field;
    }

    var row;
    for (row = 0; row < srcs[srcs[0]].length; row++) {
    var tr = trtemplate.cloneNode(true);
    var col;
    for (col=0; col < cols; col++ ) {
    var td = tdtemplate.cloneNode(true);
    var div = td.firstChild;
    div.setAttribute("datafld", srcs[col]);
    var textNode =
    document.createTextNode(srcs[srcs[col]][row].firstChild.nodeValue);
    div.appendChild(textNode);
    tr.appendChild(td);
    }
    table.appendChild(tr);
    }
    }


    function loadTableData()
    {
    if (!document.all) {
    var i;
    var xmlNodes = document.getElementsByTagName("xml");
    for (i=0; i< xmlNodes.length; i++) {
    var xml = xmlNodes;
    var id = xml.getAttribute("id");
    var table = findTable(id);
    var fields = getDataFieldNames(table);
    var srcs = getSrcFieldValues(xml, fields);
    fillTable(table, srcs);
    }
    }
    }


    function highlightRow (element, color1, color2) {
    var chk = element.checked;
    while (element.tagName.toUpperCase() != 'TR' && element != null)
    element = document.all ? element.parentElement :
    element.parentNode;

    if (element && chk) {
    element.bgColor = color1;
    } else {
    element.bgColor = color2;
    }
    }


    </script>

    </head>

    <body onload="loadTableData();">


    <xml id="xmldso_list">
    <CATALOG>
    <CD>
    <TITLE>Empire Burlesque</TITLE>
    <ARTIST>Bob Dylan</ARTIST>
    <COUNTRY>USA</COUNTRY>
    <COMPANY>Columbia</COMPANY>
    <PRICE>10.90</PRICE>
    <YEAR>1985</YEAR>
    </CD>
    <CD>
    <TITLE>Hide your heart</TITLE>
    <ARTIST>Bonnie Tyler</ARTIST>
    <COUNTRY>UK</COUNTRY>
    <COMPANY>CBS Records</COMPANY>
    <PRICE>9.90</PRICE>
    <YEAR>1988</YEAR>
    </CD>
    <CD>
    <TITLE>Greatest Hits</TITLE>
    <ARTIST>Dolly Parton</ARTIST>
    <COUNTRY>USA</COUNTRY>
    <COMPANY>RCA</COMPANY>
    <PRICE>9.90</PRICE>
    <YEAR>1982</YEAR>
    </CD>
    <CD>
    <TITLE>Still got the blues</TITLE>
    <ARTIST>Gary Moore</ARTIST>
    <COUNTRY>UK</COUNTRY>
    <COMPANY>Virgin records</COMPANY>
    <PRICE>10.20</PRICE>
    <YEAR>1990</YEAR>
    </CD>
    </CATALOG>
    </xml>





    <h1>Table Samples</h1>

    <p>This sample shows how to mimic XML Data Islands in Mozilla with
    tables. This sample
    code is not meant for production use as it is very fragile as it stands
    here (very
    primitive browser capability test, requires certain template table
    layout and so on).</p>

    <h2>Names</h2>


    <table border=1 bgcolor=yellow>
    <tr align=left><th>Title: </th>
    <td><input type=text></td></tr>

    <tr align=left><th>Artist: </th>
    <td><input type=text></td></tr>

    <tr align=left><th>Year: </th>
    <td><input type=text></td></tr>

    <tr align=left><th>Country:</th>
    <td><input type=text></td></tr>

    <tr align=left><th>Company:</th>
    <td><input type=text></td></tr>

    <tr align=left><th>Price: </th>
    <td><input type=text></td></tr>
    </table>

    <br>

    <input type=BUTTON
    ONCLICK="addRowDOM('table1','Check','MyTitle','MyArtist','MyYear',
    'MyCountry','MyCompany','MyPrice')" value="Add" >

    <br>
    <br>


    <table id="table1" datasrc="#xmldso_list" border=1>
    <thead>
    <tr align=left>
    <th>Choice</th>
    <th>Title</th>
    <th>Artist</th>
    <th>Country</th>
    <th>Company</th>
    <th>Price</th>
    <th>Year</th>
    </tr>
    </thead>
    <tr align=left><td><input type="checkbox" name="check" onclick
    ="highlightRow(this, 'yellow', 'transparent');" <div></td>
    <td><div datafld="TITLE" /td>
    <td><div datafld="ARTIST" /td>
    <td><div datafld="COUNTRY" /td>
    <td><div datafld="COMPANY" /td>
    <td align=right><div datafld="PRICE" /td>
    <td><div datafld="YEAR" /td>
    </tr>
    </table>



    </body>
    </html>
     
    milkyway, Dec 7, 2004
    #1
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Bomb Diggy
    Replies:
    0
    Views:
    447
    Bomb Diggy
    Jul 28, 2004
  2. First_step_to_xml
    Replies:
    0
    Views:
    706
    First_step_to_xml
    Jun 28, 2006
  3. Erik Wasser
    Replies:
    5
    Views:
    463
    Peter J. Holzer
    Mar 5, 2006
  4. noff
    Replies:
    0
    Views:
    208
  5. edfialk
    Replies:
    2
    Views:
    89
    edfialk
    Aug 3, 2007
Loading...

Share This Page