JavaScript for E-Commerce

Back | Contents | Next

Framework - cat-cd.html, ...

The cat-cd.html, cat-record.html, cat-tape.html files include drop down lists for all of the categories in each product type.

Source

<html>

<head>

<script>
<!--
function selectCategory() {
    var e = document.categoryForm.selCategory;
    parent.itemFrame.location = e.options[e.selectedIndex].value;
    if(e.selectedIndex == 0) {
        parent.parent.contentFrame.location = "main.html";
    }
}
//-->
</script>

</head>

<body>

<form name="categoryForm">

<font size="-1">Category:<br></font>

<select name="selCategory" onChange="selectCategory();">
    <option value="item-initial.html" selected>Welcome...</option>
    <option value="item-cd-blues.html">Blues</option>
    <option value="item-cd-classical.html">Classical</option>
    <option value="item-cd-country.html">Country</option>
    <option value="item-cd-rock.html">Rock</option>
    <option value="item-cd-techno.html">Techno</option>
</select>

</form>

</body>

</html>
			

Description

Only the source of cat-cd.html is listed here.

These files take much the same form as the product.html file, but instead of the drop down list showing product types it shows categories.

The selectCategory function here works almost exactly the same way as the selectProduct function in the product.html file. The difference is that it is loading item*.html files into the item list frame, and that if the first option ("Welcome...") is selected, the main.html file is loaded into the content frame.


Back | Contents | Next

If you find this tutorial useful and want to show your apprectiation, a small donation is most welcome.