Java下拉列表联动的实现（从数据库读取数据）
很多时候在界⾯布局时我们会⽤到下拉列表，单独的⼀个列表与数据库的交互很简单，今天要记录的是当有多个下拉列表联动时，该怎样获取数据，即选择第⼀个下拉列表的值，动态的改变第⼆个下拉列表乃⾄更多列表的值。
1、在jsp中定义第⼀个下拉列表，并且从servlet中获取list列表读取出option的value（此处关于EL表达式以及c标签的使⽤不在赘述）
<select onchange="getShoppe()" id="bra" name="brand" >
<option>选择您购买的品牌</option>
<c:forEach var="brandL" items="<%=Attribute("brandlist") %>">
<option value="${brandL.name }" id="${de }">${brandL.name }</option>
</c:forEach>
</select>
2、定义第⼆个下拉列表（这个下拉列表的option需要依赖第⼀个下拉列表的改变⽽改变）
<select name="shop" id="shoppe" onchange="getStaff()" >
</select>
3、下拉列表的onchange()事件调⽤该⽅法（此⽅法中接收servlet传⼊的json数据，需导⼊json包在lib下）
function getShoppe() {//如果第⼀个下拉列表的值改变则调⽤此⽅法
var code = $("#bra option:selected").attr("id");//得到第⼀个下拉列表的值
if(code!=null && "" != code&& -1 != code){
//通过ajax传⼊后台，把orderTypeName数据传到后端
$.post("GetShoppeServlet",{code:code},function(data){
var res = $.parseJSON(data);//把后台传回的json数据解析
var option;
option="<option>"+"选择您购买的专柜"+"</option>" ;
$.each(res,function(i,n){//循环，i为下标从0开始，n为集合中对应的第i个对象
option += "<option value='"+n.name+"'>"+n.name+"</option>"
});
$("#shoppe").html(option);//将循环拼接的字符串插⼊第⼆个下拉列表
$("#shoppe").show();//把第⼆个下拉列表展⽰
});
el表达式获取session中的值}else {
$("#shoppe").hide();
}
}
4、新建⼀个和⽅法中同名的，根据数据库读出的数据，返回⼀个json对象
HttpSession Session();
int code=Integer.Parameter("code"));
System.out.println(code);
List<Scanf> ScanfShoppe(code);
session.setAttribute("shoppelist", shoppelist);
List<Scanf> l=(List<Scanf>)Attribute("shoppelist");
//System.out.(0).getName());
out.JSONString(l));
总的来说，我们要在页⾯中异步的实现两个甚⾄多个select的联动，需要在servlet中返回⼀个json的对象，然后返回给js进⾏解析后赋值给option

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。