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 Coder
    Join Date
    May 2004
    Posts
    51
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Internet Explorer how to toogle a table style display if its written like this?

    hi! finally able to do a table using DOM but i cant seem to toogle the style display. can anyone help? my code seen abit messy (nt real programer ) so hope u all dun mind. by the way, my toogle state function dun work as i cant find the next children/sibling/watever ....

    <html>
    <head>
    <script language ="JAVASCRIPT">
    var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
    xmlDoc.load("note.xml");
    var strContent =""
    var transfernode =""
    function TestChildren(nodes)
    {
    document.writeln("<table border = 1>");
    document.writeln("<tr>");
    document.writeln("<td>");
    document.writeln("<A onClick='javaScript:toogle_state(this)'><font color= red><IMG SRC='minus.gif'>"+ nodes.nodeName +"</font></A>");
    if (nodes.hasChildNodes)
    {
    for (var i=0; i < nodes.childNodes.length; i++)
    {
    document.writeln("<table border = 1>");
    document.writeln("<tr>");
    document.writeln("<td>");
    if (nodes.childNodes(i).hasChildNodes) // add toogle in
    {
    document.writeln("<font color= red><A onClick='javaScript:toogle_state(this)'><IMG SRC='minus.gif'>"+nodes.childNodes(i).nodeName +"</A></font>");
    writechildren(nodes.childNodes(i))
    }
    else
    {
    document.writeln(nodes.childNodes(i).nodeName);
    }
    document.writeln("</tr>");
    document.writeln("</td>");
    document.writeln("</table>");
    }
    }
    document.writeln("</td>");
    document.writeln("</tr>");
    document.writeln("</table>");
    }

    function toogle_state(nodeCounter)
    {

    // Unfold the branch if it isn't visible
    alert(nodeCounter.childNodes(0).nodeName + nodeCounter.childNodes(1).data)
    if (nodeCounter.nextSibling.style.display == 'none')
    {

    // Change the image (if there is an image)
    if (nodeCounter.children.length > 0)
    {
    if (nodeCounter.children.item(0).tagName == "IMG")
    {
    nodeCounter.children.item(0).src = "minus.gif";
    }
    }
    nodeCounter.nextSibling.style.display = '';
    }
    // Collapse the branch if it IS visible
    else
    {
    // Change the image (if there is an image)
    if (nodeCounter.children.length > 0)
    {
    if (nodeCounter.children.item(0).tagName == "IMG")
    {
    nodeCounter.children.item(0).src = "plus.gif";
    }
    }

    nodeCounter.nextSibling.style.display = 'none';

    }
    }


    function writechildren(sianz)
    {
    if (sianz.hasChildNodes)
    {
    for (var i=0; i < sianz.childNodes.length; i++)
    {
    document.writeln("<table border = 1>");
    document.writeln("<tr>");
    document.writeln("<td>");

    if (sianz.childNodes(i).hasChildNodes) // add toogle in
    {

    if (sianz.childNodes(i).nodeName == "#text")
    {
    document.writeln("<font color= red><A onClick='javaScript:toogle_state(this)'><IMG SRC='minus.gif'>"+ sianz.childNodes(i).text + "</A></font>");
    writechildren(sianz.childNodes(i))
    }
    else
    {
    document.writeln("<font color= red><A onClick='javaScript:toogle_state(this)'><IMG SRC='minus.gif'> "+ sianz.childNodes(i).nodeName + "</A></font>");
    writechildren(sianz.childNodes(i))
    }

    }
    else
    {
    if (sianz.childNodes(i).nodeName == "#text")
    {
    document.writeln(sianz.childNodes(i).text);
    writechildren(sianz.childNodes(i))
    }
    else
    {
    document.writeln(sianz.childNodes(i).nodeName);
    writechildren(sianz.childNodes(i))
    }
    }

    document.writeln("</tr>");
    document.writeln("</td>");
    document.writeln("</table>");
    }
    }

    }
    function callReadXml()
    {
    root = xmlDoc.documentElement;
    TestChildren(root);
    }
    </script>
    </head>
    <body>
    <script type="text/javascript">
    callReadXml();
    </script>
    </body>
    </html>

  • #2
    New Coder
    Join Date
    May 2004
    Posts
    51
    Thanks
    0
    Thanked 0 Times in 0 Posts
    got a crazy idea of reading the node name in the html then pass it back to the xml then search in the xml for it children then pass the children back to the html then use the getElementsbyName then look for it in the html then style.display and toogle it state, but seen alot of coding .... can anyone help?

  • #3
    New Coder
    Join Date
    May 2004
    Posts
    51
    Thanks
    0
    Thanked 0 Times in 0 Posts
    seen like my crazy idea work! ya~ lol, so i post just to tell u all i done it already and no ans is needed


  •  

    Posting Permissions

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