要实现一个 二级联动, 决定用 jquery 去实现
先来看 页面上的部分
<select name="newsType" id="newsType" class="inputbg required validate-selection" >
<option value="">--请选择--</option>
<c:choose>
<c:when test="${!empty newsTypes}">
<c:forEach items="${newsTypes}" var="entity" varStatus="entityIndex">
<option value="${entity.id}">${entity.name }</option>
</c:forEach>
</c:when>
</c:choose>
</select>
</select>
<select id="type" name="type" class="inputbg required validate-selection">
<option value="">--请选择--</option>
</select>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> $(function(){ $("#newsType").change(function(){ $.getJSON("news/getNewsType.action?timestamp="+new Date(),{newstype:$(this).val()},function(data){ $("#type").get(0).options.length=1;//清一下选项,只留下第一项 $.each(data,function(i){ $("#type").append("<option value=\""+data[i].s_entityId+"\">"+data[i].s_entityName+"</option>"); }); }); }); });
后台action
public void getNewsType()throws Exception{
HttpServletResponse response = getResponse();
response.setContentType("text/json; charset=GBK");
response.setCharacterEncoding("GBK");
PrintWriter out = response.getWriter();
try {
String unit=getParameter("newstype");
System.out.print(unit);
List entityList = userDAO.findEntityByParentId(unit);
Iterator<Entity> iterator = entityList.iterator();
String dataTemp="";
while(iterator.hasNext()){
Entity entity = (Entity)iterator.next();
String name = entity.getName();
long id = entity.getId();
if("".equals(dataTemp)){
dataTemp="[{s_entityId:\""+id+"\",s_entityName:\""+name+"\"}";
}else{
dataTemp+=",{s_entityId:\""+id+"\",s_entityName:\""+name+"\"}";
}
}
dataTemp+="]";
out.print(dataTemp);
} catch (Exception e) {
e.printStackTrace();
}
}