Creating a List Box Containing the Top-Level Sections

[KB]

This exercise will insert a list box containing a list of top-level sections into the HTML of your store. As soon as a customer selects a section, they will jump to it.

It will look like the following:

Place the following function just above the </head> tag in your overall page layout.

<actinic:variable name="JavaScriptArray" value="All Data From Top Level Sections" />

<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">

<!--

//ACT_ListBox(ar)
//ar= Section array name, returns a string containing the HTML for the SELECT listbox.

function ACT_ListBox(ar)
{
var strIDs = '<SELECT SIZE="' + ar.length + '" NAME="ACT_lstbox" onClick="if(options[selectedIndex].value) window.location.href=(options[selectedIndex].value)">'
var sel = ' SELECTED'

for (var i=1;i<=ar.length;i++)
{
strIDs += '<OPTION ' + sel + ' VALUE="' + ar[i].sURL + '">' + ar[i].sName + '</OPTION>'
sel = ''
}
strIDs+='</SELECT>'
return strIDs
}
//-->
</script>

And then the following code where you want the list box to appear:

<FORM>
<script language=Javascript1.2>
document.write(ACT_ListBox(sections) + "<BR>")
</script>
</FORM>

For more information about creating section lists with javascript see this article