JavaScript for E-Commerce

Framework - product.html

The product.html file includes a drop down list where the user can select the desired product type.

Source

<html>

<head>

<script>
<!--
function selectProduct() {
    var e = document.productForm.selProduct;
    parent.categoryFrame.location = e.options[e.selectedIndex].value;
    parent.itemFrame.location = "item-initial.html";
}
//-->
</script>

</head>

<body>

<form name="productForm">

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

<select name="selProduct" onChange="selectProduct();">
    <option value="cat-cd.html">CDs</option>
    <option value="cat-record.html">Records</option>
    <option value="cat-tape.html">Tapes</option>
</select>

</form>

</body>

</html>

Description

The drop down list defined here has three options labelled "CDs", "Records" and "Tapes".

When the user selects a new product type, the function selectProduct is called. This function loads the HTML file specified by the value of the selected option into the category frame. The item-initial.html file is then loaded into the item frame.

Back | Contents | Next

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