二级联动

JSP代码

 <div class="form-group mon-group">                              
      <select id="countyName" name="countyName" class="form-control" style="170px;">                                             
           <option value="">请选择县区</option>
                 <c:forEach items="${dituOfficeList}" var="officeList">
                       <option data-id="${officeList.county_code}" value="${officeList.county_name}" <c:if test="${officeList.county_name eq dituJzwBuildInfo.countyName}">selected="selected"</c:if>>${officeList.county_name}</option>
                 </c:forEach>                                                                                
        </select>                             
 </div> 
                          
  <div class="form-group mon-group">
           <select id="yxzxName" name="yxzxName" class="form-control"  style="170px;">
                  <option value="">请选择营服</option>                                                      
            </select>                              
  </div>

JS代码

function yxzxinit(){
            var id=$('#countyName option:selected').attr("data-id");                 
                $.ajax({
                type: 'POST',
                url: "${ctx}/ditu/dituDispatchDataQuery/findyxzxNameQueryList",
                dataType: 'json',
                data:{
                    id : id                    
                },
                success: function(data) {
                     $('#yxzxName').empty();
                     var yxzx=data.yxzxNameQuery;
                     if(null != yxzx && yxzx.length >0){
                         $("#yxzxName").append("<option value=''>"+"请选择营服"+"</option>");
                         for(var i = 0; i < yxzx.length; i++){
                             if(yxzx[i].yxzx_name == '${dituJzwBuildInfo.yxzxName}'){
                                 $("#yxzxName").append("<option value='"+yxzx[i].yxzx_name+"' selected="selected">"+yxzx[i].yxzx_name+"</option>");    
                             }else{
                                 $("#yxzxName").append("<option value='"+yxzx[i].yxzx_name+"'>"+yxzx[i].yxzx_name+"</option>");     
                             }                         
                         }                                                         
                     }else{
                         $("#yxzxName").append("<option value=''>"+"请选择营服"+"</option>");
                     }
                    }                             
             });
        }    
            
         $('#countyName').change(function(){                                           
             yxzxinit();                                               
         });
         if($.trim('${dituJzwBuildInfo.countyName}')){
             yxzxinit();
         }