JS二级联动下拉列表 PHP实现

ab168

<script type="text/javascript">
var optionArray = new Array();
<?php
$grade_sql = "select distinct grade_id from subjects";
$grade_result = $dbconn -> get_result($grade_sql);
while($grade_row = mysql_fetch_assoc($grade_result)){
$grade_id = $grade_row['grade_id'];
?>
optionArray[<?php echo $grade_id;?>] = new Array();
<?php
}
?>
<?php
$subject_sql = "select * from subjects order by grade_id";
$subject_result = $dbconn -> get_result($subject_sql);
$start_pos = 0;
$start_grade = 0;
while($subject_row = mysql_fetch_assoc($subject_result)){
$grade_id = $subject_row['grade_id'];
$subject_id = $subject_row['id'];
$name  = $subject_row['name'];
if($start_grade != $grade_id){
$start_pos = 0;
$start_grade = $grade_id;
}
?>
optionArray[<?php echo $grade_id;?>][<?php echo $start_pos;?>] = new Option("<?php echo $name;?>", "<?php echo $subject_id;?>");
<?php
$start_pos++;
}
?>
function redirec(x){
var temp = document.frm.subject_id;
for (i=0;i<optionArray[x].length;i++){
temp.options=new Option(optionArray[x].text,optionArray[x].value);
}
temp.options[0].selected=true;
}
</script>


<select name="grade_id" id="grade_id" style="width:150px;" onChange="redirec(this.options[this.options.selectedIndex].value)">
<option value="">请选择年级</option>
<?php
while($row = mysql_fetch_assoc($result)){
$grade_id = $row['id'];
$grade_name = $row['name'];
?>
<option value="<?php echo $grade_id ;?>"><?php echo $grade_name ;?></option>
<?php
}
?>
</select>
<select name="subject_id" id="subject_id" style="width:150px;"></select>
 
<script type="text/javascript">
var optionArray = new Array();
optionArray[1] = new Array();
optionArray[2] = new Array();
optionArray[4] = new Array();
optionArray[5] = new Array();
optionArray[6] = new Array();
optionArray[7] = new Array();
optionArray[8] = new Array();
optionArray[9] = new Array();
optionArray[10] = new Array();
optionArray[11] = new Array();
optionArray[12] = new Array();
optionArray[13] = new Array();
optionArray[1][0] = new Option("语文", "1");
optionArray[1][1] = new Option("数学", "2");
optionArray[1][2] = new Option("英语", "5");
optionArray[1][3] = new Option("品德社会", "39");
optionArray[1][4] = new Option("心理健康教育", "67");
optionArray[2][0] = new Option("英语", "6");
optionArray[2][1] = new Option("数学", "7");
optionArray[2][2] = new Option("语文", "8");
optionArray[2][3] = new Option("品德社会", "40");
optionArray[4][0] = new Option("英语", "9");
optionArray[4][1] = new Option("数学", "10");
optionArray[4][2] = new Option("语文", "11");
optionArray[4][3] = new Option("品德社会", "45");
optionArray[5][0] = new Option("数学", "12");
optionArray[5][1] = new Option("英语", "13");
optionArray[5][2] = new Option("语文", "14");
optionArray[5][3] = new Option("品德社会", "41");
optionArray[6][0] = new Option("英语", "15");
optionArray[6][1] = new Option("数学", "16");
optionArray[6][2] = new Option("语文", "17");
optionArray[6][3] = new Option("品德社会", "43");
optionArray[7][0] = new Option("英语", "18");
optionArray[7][1] = new Option("数学", "19");
optionArray[7][2] = new Option("语文", "20");
optionArray[7][3] = new Option("品德社会", "42");
optionArray[8][0] = new Option("英语", "21");
optionArray[8][1] = new Option("数学", "22");
optionArray[8][2] = new Option("语文", "23");
optionArray[8][3] = new Option("历史与社会", "61");
optionArray[8][4] = new Option("思想政治", "62");
optionArray[8][5] = new Option("历社", "68");
optionArray[9][0] = new Option("英语", "24");
optionArray[9][1] = new Option("数学", "25");
optionArray[9][2] = new Option("语文", "26");
optionArray[9][3] = new Option("物理", "44");
optionArray[9][4] = new Option("历史与社会", "63");
optionArray[9][5] = new Option("思想政治", "64");
optionArray[10][0] = new Option("英语", "27");
optionArray[10][1] = new Option("数学", "28");
optionArray[10][2] = new Option("语文", "29");
optionArray[10][3] = new Option("物理", "46");
optionArray[10][4] = new Option("化学", "47");
optionArray[10][5] = new Option("历史与社会", "65");
optionArray[10][6] = new Option("思想政治", "66");
optionArray[11][0] = new Option("英语", "30");
optionArray[11][1] = new Option("数学", "31");
optionArray[11][2] = new Option("语文", "32");
optionArray[11][3] = new Option("物理", "50");
optionArray[11][4] = new Option("化学", "54");
optionArray[11][5] = new Option("思想政治", "56");
optionArray[11][6] = new Option("生物", "57");
optionArray[12][0] = new Option("英语", "33");
optionArray[12][1] = new Option("数学", "34");
optionArray[12][2] = new Option("语文", "35");
optionArray[12][3] = new Option("物理（必修）", "51");
optionArray[12][4] = new Option("化学（必修）", "52");
optionArray[12][5] = new Option("物理必修加选修", "53");
optionArray[12][6] = new Option("生物", "58");
optionArray[12][7] = new Option("思想政治", "59");
optionArray[13][0] = new Option("英语", "36");
optionArray[13][1] = new Option("数学", "37");
optionArray[13][2] = new Option("语文", "38");
optionArray[13][3] = new Option("化学", "48");
optionArray[13][4] = new Option("物理", "49");
optionArray[13][5] = new Option("历史", "55");
optionArray[13][6] = new Option("思想政治", "60");
function redirec(x){
var temp = document.frm.subject_id;
for (i=0;i<optionArray[x].length;i++){
temp.options=new Option(optionArray[x].text,optionArray[x].value);
}
temp.options[0].selected=true;
}
</script>
<form action="save_title.php"  method="post" name="frm">
<select name="grade_id" id="grade_id" style="width:150px;" onChange="redirec(this.options[this.options.selectedIndex].value)">
<option value="">请选择年级</option>
<option value="1">小学一年级</option>
<option value="2">小学二年级</option>
<option value="4">小学三年级</option>
<option value="5">小学四年级</option>
<option value="6">小学五年级</option>
<option value="7">小学六年级</option>
<option value="8">初中七年级</option>
<option value="9">初中八年级</option>
<option value="10">初中九年级</option>
<option value="11">高中一年级</option>
<option value="12">高中二年级</option>
<option value="13">高中三年级</option>
</select>
<select name="subject_id" id="subject_id" style="width:150px;"></select>
</form>