<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
<!--
var displayedTopic = 0;
var mainTopic = new Array();
var subTopic = new Array();
//
mainTopic[0] = "A1 topic";
mainTopic[1] = "A2 topic";
mainTopic[2] = "A3 topic";
mainTopic[3] = "A4 topic";
//
subTopic[0] = new Array();
subTopic[0][0] = "A1 subtopic 1";
subTopic[0][1] = "A1 subtopic 2";
subTopic[0][2] = "A1 subtopic 3";
subTopic[0][3] = "A1 subtopic 4";
//
subTopic[1] = new Array();
subTopic[1][0] = "A2 subtopic 1";
subTopic[1][1] = "A2 subtopic 2";
subTopic[1][2] = "A2 subtopic 3";
subTopic[1][3] = "A2 subtopic 4";
//
subTopic[2] = new Array();
subTopic[2][0] = "A3 subtopic 1";
subTopic[2][1] = "A3 subtopic 2";
subTopic[2][2] = "A3 subtopic 3";
subTopic[2][3] = "A3 subtopic 4";
//
subTopic[3] = new Array();
subTopic[3][0] = "A4 subtopic 1";
subTopic[3][1] = "A4 subtopic 2";
subTopic[3][2] = "A4 subtopic 3";
subTopic[3][3] = "A4 subtopic 4";
function fillTopic(selectObj,anArray) {
for (i=0;i<anArray.length;i++) {
selectObj.options[i] = new Option(anArray[i],i);
}
}
function fillSubTopic(selectedTopicPos) {
var nbOptions = document.all.subTopic.options.length;
for (i=nbOptions-1;i>=0;i--) {
document.all.subTopic.options[i] = null;
}
for (i=0;i<subTopic[selectedTopicPos].length;i++) {
document.all.subTopic.options[i] = new Option(subTopic[selectedTopicPos][i],i);
}
}
//-->
</script>
<select name="mainTopic" onchange="fillSubTopic(this.selectedIndex)">
</select>
<select name="subTopic">
</select>
<script language="JavaScript" type="text/javascript">
<!--
fillTopic(document.all.mainTopic,mainTopic);
fillSubTopic(0);
//-->
</script>
</body>
</html>
