JavaScript Program to Change Menu Options Dynamically

JavaScript Program to Change Menu Options Dynamically

Write a JavaScript program to change menu options dynamically.



Source Code
<html>
<head>
    <title>Dynamically Changing Menu Options</title>
    <script>
        compStaff = new Array('R. S. Tamkhane', 'A. B. Chavan', 'S. C. Waghmare');
        etcStaff = new Array('ABC', 'XYZ');

        function Getemployees(Department) 
        {
            // clear out the current options
            for(i = document.form1.employees.options.length-1; i> 0; i--)
            {
                document.form1.employees.options.remove(i);
            }
            
            dept = Department.options[Department.selectedIndex].value;
            if (dept != "") 
            {
                if (dept == '1')
                {
                    for (i=1; i <= compStaff.length; i++) 
                    {
                        document.form1.employees.options[i] = new Option(compStaff[i-1])
                    }
                }
                if (dept == '2')
                {
                    for (i = 1; i <= etcStaff.length; i++) 
                    {
                        document.form1.employees.options[i] = new Option(etcStaff[i-1])
                    }
                }
            }
        }
    </script>
</head>
<body onload="document.form1.deptList.selectedIndex=0">
<form action="MyCGI.cgi" name="form1">
    <select name="deptList" onchange="Getemployees(this)">
        <option value="0">Department</option>
        <option value="1">Computer</option>
        <option value="2">E & TC</option>
    </select>
    <select name="employees">
        <option value="0">employees</option>
    </select>
    <br>
    <p>
    <input type="submit" value="Submit" />
    <input type="reset" />
    </p>
</form>
</body>
</html>
Output