jquery+ligerform三级联动下拉框

浏览数：25 / 时间：2015年06月09日

如下为ligerform里的三级联动下拉框：

 var formData=[
         {display:"县区",name:"QY",newline:true,labelWidth:100,width:220,space:50,type:"select",group:"区域信息",groupicon:"@Url.Content("~/Content/icons/32X32/communication.gif")",comboboxName:"QYName",options:{valueFieldID:"QY" }}, 
         {display:"镇/街道",name:"ZHEN",newline:false,labelWidth:100,width:220,space:50,type:"select",comboboxName:"ZHENName",options:{valueFieldID:"ZHEN"}},
         {display:"村/道路",name:"CUN",newline:true,labelWidth:100,width:220,space:50,type:"select",comboboxName:"CUNName",options:{valueFieldID:"CUN"}}]           
        
         //创建表单结构
         var mainform = $("#mainform");  
         mainform.ligerForm({ 
             inputWidth: 280,
             fields: formData,
             toJSON:JSON2.stringify
         })

需求：加载页面时，加载“县区”下拉框；选择县区后，加载“镇/街道”下拉框；选择镇/街道后，加载“村/道路”下拉框。

代码如下：

        //加载区域下拉框
        $.getJSON(rootPath1+ ‘CaseInfoFC/GetAreasForSelect?idfield=id&textfield=text&where=‘+ JSON2.stringify({
            op: ‘and‘,
            rules: [{ field: ‘ParentCode‘, value: ‘4413‘, op: ‘equal‘ }]  //4413-一级区域的parentcode
        }) , 
            function(json){ 
                var newData = new Array();
                for (i = 0; i < json.length; i++)
                {
                    newData.push(json[i]);
                }
                liger.get("QYName").setData(newData); 
            }); 


        //选择区域后，加载镇/小区下拉框
         $("#QYName").ligerComboBox({ onSelected: function (newvalue)
         {
             if(newvalue==null) return; 
             var newData = new Array();
             $.getJSON(rootPath1+ ‘CaseInfoFC/GetAreasForSelect?idfield=id&textfield=text&where=‘+ JSON2.stringify({
                 op: ‘and‘,
                 rules: [{ field: ‘ParentCode‘, value: newvalue, op: ‘equal‘ }] 
             }) , 
            function(json){              
                for (i = 0; i < json.length; i++)
                {
                    newData.push(json[i]);
                }
                liger.get("ZHENName").setData("");
                //liger.get("ZHENName").selectValue(null);//注释掉，否则加载不到后台传过来的值
                liger.get("ZHENName").setData(newData);
            })
         }});


        //选择镇/街道后，加载村/小区/道路下拉框
         $("#ZHENName").ligerComboBox({ onSelected: function (newvalue)
         {
             if(newvalue==null) return; 
             var newData = new Array();
                 $.getJSON(rootPath1+ ‘CaseInfoFC/GetAreasForSelect?idfield=id&textfield=text&where=‘+ JSON2.stringify({
                     op: ‘and‘,
                     rules: [{ field: ‘ParentCode‘, value: newvalue, op: ‘equal‘ }] 
                 }) , 
           function(json){              
               for (i = 0; i < json.length; i++)
               {
                   newData.push(json[i]);
               }
               liger.get("CUNName").setData(""); 
              // liger.get("CUNName").selectValue(null);
               liger.get("CUNName").setData(newData);
           })
         }});