Help pls - need to NS-proof some code!

Giganews Newsgroups
Subject: Help pls - need to NS-proof some code!
Posted by:  Dave Ello (deldridg_spamnomore_@ozemail.com.au)
Date: Fri, 28 Nov 2003

Hi all,

I am absolutely no Javascript developer (as will be evident by the code
presented), but I've created a simple bit of code that wil expand/collapse
rows in a table and present the appropiate "+" or "-" symbol.  It works in
IE but I'm supposed to NS proof it.

I know there are a gazillion more elegant solutions, but this is my attempt
at writing something generic.  If you could either assist with the NS bit or
show me an equally simple way to achieve the same effect, without tree
controls etc. I would appreciate it very much and owe you a beer (or
wine...)!

The code is below.

Regards,
David Eldridge

-----------------------

<html>

<head>

<script language=javascript>

    function hidetbl(obj)

    {

        // Hide the passed table and present a "+" symbol

        // with the Javascript to show the table again

        var objTable;

        var objClickableText;

        var newHTML;

        var txtIndex;

        objTable = document.all[obj];

        objTable.style.display = "none";

        txtIndex = obj.substr(3,1)

        objClickableText = document.all["cat" + txtIndex]

        newHTML = "<div id='cat" + txtIndex

        newHTML = newHTML + "' onclick=\"showtbl('prd"

        newHTML = newHTML + txtIndex + "')\">+</div>";

        objClickableText.outerHTML=newHTML;

    }

    function showtbl(obj)

    {

        // Show the passed table and present a "-" symbol

        // with the Javascript to show the table again

        var objTable;

        var objClickableText;

        var newHTML;

        var txtIndex;

        objTable = document.all[obj];

        objTable.style.display = "block";

        txtIndex = obj.substr(3,1);

        objClickableText = document.all["cat" + txtIndex]

        newHTML = "<div id='cat" + txtIndex

        newHTML = newHTML + "' onclick=\"hidetbl('prd"

        newHTML = newHTML + txtIndex + "')\">-</div>";

        objClickableText.outerHTML=newHTML;

    }

</script>

</head>

<body>

<table width=310 border=1 cellpadding=1>

    <tr>

        <td width=10><div id='cat1' onclick="showtbl('prd1')">+</div></td>

        <td width=300>Category 1</td>

    </tr>

<tr>

    <td colspan=2>

        <table width=100% id="prd1" style="display:none">

            <tr>

                <td><em>Prod 1</em></td>

                <td><em>Description 1</em></td>

            </tr>

            <tr>

                <td><em>Prod 2</em></td>

                <td><em>Description 2</em></td>

            </tr>

            <tr>

                <td><em>Prod 3</em></td>

                <td><em>Description 3</em></td>

            </tr>

        </table>

    </td>

</tr>

    <tr>

        <td width=10><div id="cat2" onclick="showtbl('prd2')">+</div></td>

        <td width=300>Category 2</td>

    </tr>

<tr>

    <td colspan=2>

        <table width=100% id="prd2" style="display:none">

            <tr>

                <td><em>Prod 1</em></td>

                <td><em>Description 1</em></td>

            </tr>

            <tr>

                <td><em>Prod 2</em></td>

                <td><em>Description 2</em></td>

            </tr>

            <tr>

                <td><em>Prod 3</em></td>

                <td><em>Description 3</em></td>

            </tr>

        </table>

    </td>

</tr>

</table>

</body>

</html>

Replies