jquery+ligerform三级联动下拉框

时间:2021-03-07 16:14:48

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

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

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

代码如下:

        //加载区域下拉框
$.getJSON(rootPath1+ 'CaseInfoFC/GetAreasForSelect?idfield=id&textfield=text&where='+ JSON2.stringify({
op: 'and',
rules: [{ field: 'ParentCode', value: '', op: 'equal' }] //4413-一级区域的parentcode
}) ,
function(json){
var newData = new Array();
for (i = ; 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 = ; 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 = ; 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