JSP表单select多级联动问题

注意：每次都要定义branch1,branch2,branch3，这样避免变量全局局部的问题

<tr>

<td>一级部门：</td>

<td><selectonchange="getbranch1()" id="branch1"name="branch1_no"></select></td>

<td>二级部门：</td>

<td><selectonchange="getbranch2()" id="branch2"name="branch2_no"></select></td>

<td>三级部门：</td>

<td><selectid="branch3" name="branch3_no"></select></td>

</tr>

Branch1，branch2，branch3这三级联动，

方式有两种，一种是ajax一级，一级选择->ajax二级，二级选择->ajax三级，三级选择，这样需要ajax传递三次数据到后台

另一种是，ajax一级，二级，三级数据到jsp，然后js函数控制联动筛选显示，本项目采用的是第二种，速度快，更实用。

（1）ajax拿到所有数据

functionbranchlist(){

$.ajax({

type:"POST",

url:"branchAction.action",

dataType:"json",

data:"",

success: function(json){

list1 = json.branch1list;

list2 = json.branch2list;

var branch1=$("#branch1")[0];

branch1.options.length=0;

branch1.options.add(new Option("所有一级部门","0"));

var branch2=$("#branch2")[0];

branch2.options.length=0;

branch2.options.add(new Option("所有二级部门","00"));

var branch3=$("#branch3")[0];

branch3.options.length=0;

branch3.options.add(new Option("所有三级部门","000"));

for(var i=0;i<list1.length;i++){

var option= newOption(list1[i].branch,list1[i].branch_no);

branch1.options.add(option);

}

selRefresh("branch1");

selRefresh("branch2");

selRefresh("branch3"); }

})

}

（2）js函数判断联动

functiongetbranch1(){

//根据选择的branch1的值，branch2需要载入的数据联动变化

var branch1=$("#branch1")[0];

var branch2=$("#branch2")[0];

var branch3=$("#branch3")[0];

document.all.branch2.options.length =1;

document.all.branch3.options.length =1;

var firstno=branch1.options[branch1.options.selectedIndex].value;

if(firstno != "000")

{

for(vari=0;i<list2.length;i++){

var funo =(list2[i].branch_no).substring(0,3);

if(funo = firstno)

{

var option= newOption(list2[i].branch,list2[i].branch_no);

branch2.options.add(option);

}

}

}

else{

document.all.branch2.options.length= 1;

document.all.branch3.options.length= 1;

}

selRefresh("branch2");

selRefresh("branch3");

}

functiongetbranch2(){

//根据选择的branch2的值，branch3需要载入的数据联动变化

var branch2=$("#branch2")[0];

var branch3=$("#branch3")[0];

document.all.branch3.options.length =1;

var secondno= branch2.options[branch2.options.selectedIndex].value;

if(secondno != "000")

{

for(var i=0;i<list3.length;i++){

var funo =(list3[i].branch_no).substring(0,6);

if(funo == secondno)

{

var option= newOption(list3[i].branch,list3[i].branch_no);

branch3.options.add(option);

}

}

}

else{

document.all.branch3.options.length= 1;

}

selRefresh("branch3");

}

ajax传递参数的方式：

$.ajax({

type: "POST",

url: "<%=path%>/xxxAction.action",

dataType:"json",

data:"startIndex="+startIndex+"&endIndex="+endIndex+"&branchno="+branchno+"&flag="+flag,