码迷,mamicode.com
首页 > Web开发 > 详细

jquery+ligerform三级联动下拉框

时间:2014-12-15 18:57:52      阅读:220      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   io   ar   color   sp   for   on   

如下为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);
           })
         }});


需求2:把三级下拉框选中值保存到某一个表,以后打开详情页时,读取这个表中保存的下拉框选中的值,初始化下拉框。

该需求也是涉及到select初始化问题,与上一篇的要求2 http://www.cnblogs.com/goodgirlmia/p/4165216.html 同理可得,这里就再重复了。

 

关于ligerform的select的取值与赋值,见之前发的帖子:http://www.cnblogs.com/goodgirlmia/p/4164878.html

jquery+ligerform三级联动下拉框

标签:style   blog   http   io   ar   color   sp   for   on   

原文地址:http://www.cnblogs.com/goodgirlmia/p/4165259.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!