Greetings~

I have built an array driven menu system. I just wanted to show how I did it and get any feedback on better practices...more elegant code. Lemme know your thoughts. Here is the code...

Normal array...yada...yada...yada

    var MyTrainingMenuItems = new Array();
    MyTrainingMenuItems[0] = new Array();

    MyTrainingMenuItems[0][0] = "Current";
    MyTrainingMenuItems[0][1] = "somewhere.htm";
    MyTrainingMenuItems[0][2] = "Current Registrations";

<div id="menu">
        [list]<li><a href="#"onclick="javascript:showmenu('smenu1');">M y Training</a></li></ul>
            <div id="smenu1">
                    <script language="javascript">
                        var loopCounter;
                        for (loopCounter = 0; loopCounter < MyTrainingMenuItems.length; loopCounter++)
                        {
                            document.write("<li><a href='" + MyTrainingMenuItems[loopCounter][1] + "'>" + MyTrainingMenuItems[loopCounter][2] + "</a></li>");
                        }
                    </script>
            </div>
        [list]<li><a href="#" onclick="javascript:showmenu('smenu2');">Applicati on Training</a></li></ul>
            <div id="smenu2">
                    <script language="javascript">
                        var loopCounter;
                        for (loopCounter = 0; loopCounter < ApplicationTrainingItems.length; loopCounter++)
                        {
                            document.write("<li><a href='" + ApplicationTrainingItems[loopCounter][1] + "'>" + ApplicationTrainingItems[loopCounter][2] + "</a></li>");
                        }
                    </script>
            </div>
        [list]<li><a href="#" onclick="javascript:showmenu('smenu3');">Recommend ed Path</a></li></ul>
            <div id="smenu3">
                    <script language="javascript">
                        var loopCounter;
                        for (loopCounter = 0; loopCounter < RecommendedTrainingPathsItems.length; loopCounter++)
                        {
                            document.write("<li><a href='" + RecommendedTrainingPathsItems[loopCounter][1] + "'>" + RecommendedTrainingPathsItems[loopCounter][2] + "</a></li>");
                        }
                    </script>

The above is the actual menu and this is the showmenu function..

window.onload=showmenu;
function showmenu(id) {
var d = document.getElementById(id);
    for (var i = 1; i<=10; i++) {
        if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display= 'none';}
    }
if (d) {d.style.display='block';}
}

Let me know if you guys have any better ideas. I played around with css driven menus and differing types of js menus.


Clay Hess

__________________
Clay Hess