求一个二级联动效果的Demo , 好久没有写了 今天想写竟然发现都忘记的差不多了 , 想找个小的列子看看, 大概功能就是 : 例如: 第一个下拉框 显示所有的部门, 根据第一个下拉框选中的值,动态的从数据库中加载该部门所有的人员(是从数据库中加载,不要在页面中写死,写死的那种我这有过列子了) , 然后选择人员 ,在根据选择的人员显示该人员的信息 。 只求把二级联动实现就可以了。
我现在做到能把第一个下拉框的值加载出来。 但是不知道怎么把值传到后台, 求大神给个比较完整的代码供参考!
------解决方案--------------------
[code=Java][/code]<tr>
<td align="right">
所在区域:
</td>
<td>
<form:select path="province" id="province" onchange="doliangge5()">
<c:choose>
<c:when test="${symptomMonitorInfo.province ==NULL||symptomMonitorInfo.province ==''}"> <option value="">请选择</option> <c:forEach var="na" varStatus="s"items="${listProvince2}">
<option value="${na.province}" id="province">
${na.province}
</option>
</c:forEach>
</c:when>
<c:when test="${symptomMonitorInfo.province!='' && symptomMonitorInfo.province != null}">
<form:option value="${symptomMonitorInfo.province}" id="province">${symptomMonitorInfo.province}</form:option>
<option value="">请选择</option>
<c:forEach var="na" varStatus="s" items="${listProvince2}">
<option value="${na.province}" id="province">${na.province}</option>
</c:forEach>
</c:when>
</c:choose>
</form:select>
<script type="text/javascript">
function doliangge5()
{
getStandard1111('province','city')
}
</script>
<form:select path="city" id="city">
<c:if
test="${symptomMonitorInfo.city == NULL || symptomMonitorInfo.city ==''}">
<option value="">请选择</option>
</c:if>
<c:if test="${symptomMonitorInfo.city!=''}">
<form:option value="${symptomMonitorInfo.city}">${symptomMonitorInfo.city}</form:option>
</c:if>
</form:select>
function getStandard1111(province,city){
var fid=document.getElementById(province).value;
$.post("symptomMonitorInfoForm.do?method=loadCitylist",
{'province':fid}
,function(data,status){
var Data = eval('('+data+')') ;
var listCity = Data.listCity;
$("select[name="+city+"]").empty();
$("select[name="+city+"]").append("<option value='0' selected='selected'>请选择</option>");
for(var i=0; i<listCity.length; i++){
$("select[name="+city+"]").append('<option value= '+listCity[i].city+'>'+listCity[i].city+'</option>');
}
}
)
}
有什么不明白的,可以再问我