Standard selection
Section Selection
Subject selection
on selection depend on other section depends on standard.subject depends on section If i select subject then it display that subject assignments only
Generally, when you need something to change based on a dropdown, use the onchange event. Example:
<select id="standardSelectId" onchange="fillSection(this)">...</select>
<select id="sectionSelectId" onchange="fillSubject(this)"><option>-- Select Standard first --</option></select>
<select id="subjectSelectId"><option>-- Select Section first --</option></select>
Then, write a javascript function to fill the next select with options, and clear any selects that are dependent on the next select:
<script type="text/javascript">
function fillSection(e) {
var choice = e.options[e.selectedIndex];
var sectionSelect = document.getElementById("sectionSelectId");
var subjectSelect = document.getElementById("subjectSelectId");
subjectSelect.options.length = 0;
try { subjectSelect.add(new Option("-- Select Section first --", ""))} catch(ex) {subjectSelect.add(new Option("-- Select Section first --", ""), null)}
sectionSelect.options.length = 0;
switch (choice.value) {
case <standard val1>:
try { sectionSelect.add(new Option(section1_label_1, section1_key_1))} catch(ex) {subjectSelect.add(new Option(section1_label_1, section1_key_1), null)}
...
try { sectionSelect.add(new Option(section1_label_N, section1_key_N))} catch(ex) {subjectSelect.add(new Option(section1_label_N, section1_key_N), null)}
break;
case <standard valX>:
try { sectionSelect.add(new Option(sectionX_label_1, sectionX_key_1))} catch(ex) {subjectSelect.add(new Option(sectionX_label_1, sectionX_key_1), null)}
...
try { sectionSelect.add(new Option(sectionX_label_N, sectionX_key_N))} catch(ex) {subjectSelect.add(new Option(sectionX_label_N, sectionX_key_N), null)}
break;
}
function fillSubject(e) {
...
}