Announcement

Collapse
No announcement yet.

Creating a Drop-Down List Containing the Top-Level Sections and Sub Sections

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Creating a Drop-Down List Containing the Top-Level Sections and Sub Sections

    This exercise will insert a drop-down list containing a list of sections and subsections (to three levels of depth) into the HTML of your store. As soon as a customer selects a section, they will jump to it.

    Paste the following code just above the
    HTML Code:
    </head>
    tag in your overall page layout:

    HTML Code:
    <actinic:variable value="All Data From All Sections" name="JavaScriptArray" />
    
    <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
    
    <!--
    
    /***********************************************************************
    *
    * ACT_DropListBox -returns a string containing the HTML for the SELECT listbox
    *
    ************************************************************************/
    
    function ACT_DropListBox(ar)
    {
    var strIDs = '<SELECT SIZE="1" NAME="ACT_droplstbox" onClick="if(options[selectedIndex].value) window.location.href=(options[selectedIndex].value)">';
    var sel = " SELECTED"
    
    strIDs += '<OPTION ' + sel + ' VALUE="">Select a Section</OPTION>';
    
    for (var i=1;i<=ar.length;i++)
    {
    if (ar[i].sURL !=null)
    {
    strIDs += '<OPTION VALUE="' + ar[i].sURL + '">' + ar[i].sName + '</OPTION>';
    {
    if (ar[i].pChild)
    {
    for (var j=1;j<=ar[i].pChild.length;j++)
    {
    strIDs += '<OPTION VALUE="' + ar[i].pChild[j].sURL + '">' + '- ' + ar[i].pChild[j].sName + '</OPTION>';
    {
    if (ar[i].pChild[j].pChild)
    {
    for (var k=1;k<=ar[i].pChild[j].pChild.length;k++)
    {
    strIDs += '<OPTION VALUE="' + ar[i].pChild[j].pChild[k].sURL + '">' + '- - ' + ar[i].pChild[j].pChild[k].sName + '</OPTION>';
    }
    }
    }
    }
    }
    }
    }
    }
    strIDs+='</SELECT>'
    
    return strIDs
    }
    //-->
    
    </SCRIPT>
    Then paste the following code where you want the drop-down list to appear.

    HTML Code:
    <form name="Act_SectionDroplist">
    <script language=Javascript1.1>document.write(ACT_DropListBox(section_tree))
    </script>
    For more information about creating section lists with javascript see this article
Working...
X