级联查询案例

1.后台查询所有省份信息返回省份的list集合：

Map<String, Object> map = new HashMap<String, Object>();
            String jb = "1";
            //查询省会
            List<AreaDaBean> proviceList = areaService.queryAreaByJb(jb);
            map.put("proviceList", proviceList);

2.根据省份编码ajax加载省份下的城市信息，返回json数据：

Area areaInfo = new Area();
            areaInfo.setRegionNum(regionNum);
            List<Area> arealist = areaService1.selectList_Num(areaInfo);
            result.setRetObj(JSONArray.toJSONString(arealist));

3.根据城市编码获取乡镇信息，返回json数据：

Area areaInfo = new Area();
            areaInfo.setRegionNum(regionNum);
            List<Area> arealist = areaService1.selectList_Num2(areaInfo);
            result.setRetObj(JSONArray.toJSONString(arealist));

4.页面遍历显示：每次选择之前清除之前的数据：

var proviceList = ret.retObj.proviceList;
                                    if (proviceList)
                                    {
                                        var optionStr = "<option value=''>--请选择--</option>";
                                        for (var j = 0; j < proviceList.length; j++) 
                                        {
                                            optionStr += "<option value='"+ proviceList[j].regionNum + "'>" + proviceList[j].regionName + "</option>";
                                        }
                                        $("#proviceNum").html(optionStr);
                                    }
                            //------城市--------------        
                                /**
             * 根据选择的省份编码查询身份下市级信息
             */
            $('#proviceNum').change(function(){
                var sel_value = $(this).val() //得到当前选中的值
                var sel_reg_num =sel_value.substr(0,2);
                $.ajax({ 
                      url: **** + '***/***.json', 
                      data:{"regionNum":sel_reg_num}, 
                      type:'post',  
                      cache:false,  
                      dataType:'json', 
                      success: function (ret) { 
                        if(ret){
                        if(ret.retCode == '0'){
                            var jsonArr = eval("(" + ret.retObj + ")");
                            var city = '';
                            city = '<option value="" >请选择</option>';
                            $(jsonArr).each(function(i){
                                city += '<option value="'+this.regionNum+'" >'+this.regionName+'</option>';
                            });
                          $("#cityNum").html(city);
                          //把区县下拉框置为空
                          $("#countyNum").html('<option value="">请选择</option>');
                        }else{
                        }
                     }
                    }
                 });
            });
//------------乡镇信息---------         
/**
             * 根据选择的市查询县区信息
             */
            $("#cityNum").change(function(){
                var sel_value = $(this).val() //得到当前选中的值
                var sel_reg_num =sel_value.substr(0,4);
                $.ajax({ 
                      url: ****.json', 
                      data:{"regionNum":sel_reg_num}, 
                      type:'post',  
                      cache:false,  
                      dataType:'json', 
                      success: function (ret) { 
                        if(ret){
                        if(ret.retCode == '0'){
                            var jsonArr = eval("(" + ret.retObj + ")");
                            var city = '';
                            city = '<option value="" >请选择</option>';
                            $(jsonArr).each(function(i){
                                city += '<option value="'+this.regionNum+'" >'+this.regionName+'</option>';
                            });
                          $("#countyNum").html(city);
                        }else{
                        }
                     }
                    }
                 });
          });