jquery+ligerform三级联动下拉框
如下为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
jquery+ligerform三级联动下拉框的更多相关文章
- jquery+html三级联动下拉框
jquery+html三级联动下拉框及详情页面加载时的select初始化问题 html写的三个下拉框,如下: <select name="ddlQYWZYJ" id=&q ...
- jquery+html三级联动下拉框及详情页面加载时的select初始化问题
html写的三个下拉框,如下: <select name="ddlQYWZYJ" id="ddl_QYWZYJ" class="fieldsel ...
- Android实现三级联动下拉框 下拉列表spinner
Android实现(省.市.县)三级联动下拉框 下拉列表spinner 转载请注明出处: http://www.goteny.com/articles/2013/11/46.html http://w ...
- Web 1三级联动 下拉框 2添加修改删除 弹框
Web 三级联动 下拉框 using System; using System.Collections.Generic; using System.Linq; using System.Web; u ...
- JS年月日三级联动下拉框日期选择代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 项目总结01:JSP mysql SpringMvc下中国省市县三级联动下拉框
JSP mysql SpringMvc下中国省市县三级联动下拉框 关键词 JSP mysql数据库 SpringMvc ajax Controller层 Service层 中国地区 省 ...
- JQ与AJAX 省市区三级联动下拉框
用于初学者学习基本的联动下拉框,废话不多说,见代码 首先看控制器里的3个下拉框对应代码: public ActionResult GetProvinceList() { ProvinceReposit ...
- Android实现三级联动下拉框下拉列表spinner
原文出处:http://www.cnblogs.com/zjjne/archive/2013/10/03/3350107.html 主要实现办法:动态加载各级下拉值的适配器 在监听本级下拉框,当本级下 ...
- JS(JQuery) 省市区三级联动下拉选择
引入 area.js /* * 全国三级城市联动 js版 */ function Dsy(){ this.Items = {}; } Dsy.prototype.add = function(id,i ...
随机推荐
- 【Eclipse高速发展-文章插件】google V8,对于调试Nodejs
安装的的时候能够通过 Help>Eclipse Marketplace的 搜索方式安装 或者 Help>Install New Software Name:googleV8 Locatio ...
- Shell 文字 顶替tomcat星团war包裹
执行前server造成免费ssh登陆. 修改配置文件不是太大 您可以覆盖原有的配置 profile 简介 bak=/home/wsm/bak webapps=/home/wsm/webapps/WSM ...
- hdu 3683 Gomoku (模拟、搜索)
Gomoku Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Sub ...
- ThreadLocal可能引起的内存泄露(转)
threadlocal里面使用了一个存在弱引用的map,当释放掉threadlocal的强引用以后,map里面的value却没有被回收.而这块value永远不会被访问到了. 所以存在着内存泄露. 最好 ...
- JTextField限制输入长度的完美解决方案(转)
关于JTextField限制输入字符长度的问题,因为没提供现成的api,所以我们得自己动手,来实现这个功能,网上也有很多这样的资料,大多是在JTextField的Document的insertStri ...
- Java工程(3)——但从谈论用户的角度UI图案
前言: 海南项目宣告竣工,验收之日,除部分代码有待优化外,亟待改进的就是界面. 米老师说:连你都忍不住去拖下滚动栏,你还指望用户用的舒坦吗? 顿悟: 业务.功能也许是软件的核心,技术也许是软件的精髓. ...
- linux
核心学习书籍
1<LINUX程序设计> 基础是非常重要的 2<UNIX环境高级编程> 还是基础 ,假设你是搞UNIX/Linux环境下的应用程序编程,那么就看 3, <Linux内核设 ...
- atcoder 它February 29th
Time limit : 2sec / Stack limit : 256MB / Memory limit : 256MB Problem Charlie was born January 1st ...
- Visual Studio Code开发TypeScript
[Tool] 使用Visual Studio Code开发TypeScript [Tool] 使用Visual Studio Code开发TypeScript 注意 依照本篇操作步骤实作,就可以在 ...
- 自定义View视图
自定义View视图文件查找逻辑 之前MVC5和之前的版本中,我们要想对View文件的路径进行控制的话,则必须要对IViewEngine接口的FindPartialView或FindView方法进行重写 ...