jquery插件 autoComboBox 下拉框


Posted in Javascript onDecember 22, 2010

问: 1.大家在做省市区下拉框联动,或者是产品分类联动,或者是部门联动等下拉框时怎么做? 是用ajaxpro.dll 还是jquery ajax呢??
答: 是,留下继续阅读.
否,跟帖回复你的方法
结论:每次重复劳动 重复创造联动的下拉框, 累,想死!! 读完本文 您也许可以找到更好的方法来实现 无限级(理论) 的联动下拉框,也许只要10秒钟就够了.
就这样,一个自动产生联动下拉框的插件诞生了...
本插件依赖于jquery1.4.2 最低版本自行测试.
废话完毕.
代码:
<div class="zldd-AutoComboBox" id="div_autoComboBox">
</div>

调用方法:

var data= [{ "id": 25, "text": "淮安分公司", "children": [{ "id": 26, "text": "办公室(行政人事培训)"}] }, { "id": 52, "text": "研发部" }, { "id": 53, "text": "财务部"}] 
$("#div_autoComboBox").AutoComboBox({ 
cssClass: "autoComboBox", 
nullDispaly: true, 
//url: "ComboBoxTreeDept_Data.aspx", 
//如果没有使用远程数据 则可以使用本地数据源 使用上面定义的data变量 注:如果url不为空时 优先使用远程数据源 
// ps:只请求一次数据库,数据源将存放在客户端 
data:data, 
firstValue: [true, "==请选择==", "==请选择=="] //是否自动创建第一个值 这个值通常为 请选择 ,不限等 
});

结果: 这样就一个无限级(理论) 的联动下拉框就出来了.. 如果你拷贝一下以上代码,修改一下url参数 10秒钟够了吧??? 注:关于json格式,包括名称,请自行转换,本源码也包含一个只针对本插件转换json的一个dll.
(引用后:
///dataset 数据源
///要显示text
///id,, 你懂的
///父id, 你也懂的
///忽略....
string treeJson = zlddEasyUiHelp.CreateTree.DataSetToTree(ds_department, "Dept_Name", "Dept_ID", "Dept_PId",false);
)
问:我怎么获取用户选择的值.?
答: 一句代码搞定,并支持多个参数重载
$("#div1").ComboBoxGetValue([index],[ErrorFn]); 
//可选参数说明: 
//index,获取第几个下拉框的值,默认最后一个(如果不填写也是获取最后一个值) 
// ErrorFn,获取值时遇到错误 如:假设现在是省市区联动,您要获取第三个下拉框(区),但是用户只选择到了市,这将会获取不到,那么将调用传递进去的方法 
//该回调方法写法如下: 
var ErrorFn = function () { 
alert("错误了"); 
}

看到此处您是否会用了???如果不会,你懂的,回帖....
接下来说下"修改"功能
如:刚才用户选择了自己的 地址, 那么现在用户需要修改,用户刚才选择到了"区",我们要初始化联动下拉框 并且要设置区,市,省的默认值.
很简单: 在上面的代码加一句话(下方红色标注的代码)就会自动初始化带默认值的联动下拉框
例:
$("#div_autoComboBox").AutoComboBox({ 
cssClass: "autoComboBox", 
nullDispaly: true, 
//url: "ComboBoxTreeDept_Data.aspx", 
//如果没有使用远程数据 则可以使用本地数据源 使用上面定义的data变量 注:如果url不为空时 优先使用远程数据源 
// ps:只请求一次数据库,数据源将存放在客户端 
data:data, 
defaultValue: 76, 
firstValue: [true, "==请选择==", "==请选择=="] //是否自动创建第一个值 这个值通常为 请选择 ,不限等 
});

关于"修改"功能的诞生背景,有兴趣的看...
话说本插件是不可以设置默认值的,也就是不能自初始化带默认值的下拉框
但是,由于一个美女诱惑我,说"你要弄出来,我就干嘛嘛",,具体干嘛,各位懂的....
到此介绍完毕
源码下载,/201012/yuanma/AutoComboBoxs.rar(已更新)

(源码只包括插件源码,转换json格式字符串的dll)
2011年1月4日17:12:39更新

版本 v1.1

更新内容

修复部分已知bug(如果子类没有顶级选项如"请选择" 造成第三级无法创建的问题)

增加获取选定项对象的方法

性能的优化

原文: http://www.cnblogs.com/337212522/archive/2010/12/21/1912381.html

Javascript 相关文章推荐
jQuery中.live()方法的用法深入解析
Dec 30 Javascript
IE与FireFox的JavaScript兼容问题解决办法
Dec 31 Javascript
JavaScript实现数组在指定位置插入若干元素的方法
Apr 06 Javascript
javascript文本模板用法实例
Jul 31 Javascript
解析JavaScript实现DDoS攻击原理与保护措施
Dec 26 Javascript
easyui combotree加载静态数据问题(选不上)解决方法
Dec 26 Javascript
Javascript中字符串相关常用的使用方法总结
Mar 13 Javascript
react.js CMS 删除功能的实现方法
Apr 17 Javascript
浅谈AngularJS中使用$resource(已更新)
Sep 14 Javascript
微信小程序 动画的简单实例
Oct 12 Javascript
VUE接入腾讯验证码功能(滑块验证)备忘
May 07 Javascript
js实现div色块碰撞
Jan 16 Javascript
Jquery截取中文字符串的实现代码
Dec 22 #Javascript
jquery里的each使用方法详解
Dec 22 #Javascript
jQuery学习笔记之jQuery的动画
Dec 22 #Javascript
jQuery学习笔记之jQuery的事件
Dec 22 #Javascript
jQuery学习笔记之jQuery的DOM操作
Dec 22 #Javascript
jQuery学习笔记之jQuery选择器的使用
Dec 22 #Javascript
jQuery学习笔记之DOM对象和jQuery对象
Dec 22 #Javascript
You might like
PHP中文件读、写、删的操作(PHP中对文件和目录操作)
2012/03/06 PHP
PHP curl 获取响应的状态码的方法
2014/01/13 PHP
Yii中表单用法实例详解
2016/01/05 PHP
详解PHP的Yii框架中扩展的安装与使用
2016/04/01 PHP
php使用PDO从数据库表中读取数据的实现方法(必看)
2017/06/02 PHP
使用PHPStorm+XDebug搭建单步调试环境
2017/11/19 PHP
当json键为数字时的取值方法解析
2013/11/15 Javascript
js实现select选择框效果及美化
2016/08/19 Javascript
javascript使用闭包模拟对象的私有属性和方法
2016/10/05 Javascript
AngularJs中Bootstrap3 datetimepicker使用实例
2016/12/13 Javascript
JavaScript实现事件的中断传播和行为阻止方法示例
2017/01/20 Javascript
常用jQuery选择器汇总
2017/02/02 Javascript
Node.js 基础教程之全局对象
2017/08/06 Javascript
React-native桥接Android原生开发详解
2018/01/17 Javascript
详解Vue实战指南之依赖注入(provide/inject)
2018/11/13 Javascript
[01:04:31]DOTA2-DPC中国联赛定级赛 iG vs Magma BO3第二场 1月8日
2021/03/11 DOTA
Python import自定义模块方法
2015/02/12 Python
简单的连接MySQL与Python的Bottle框架的方法
2015/04/30 Python
深入理解NumPy简明教程---数组1
2016/12/17 Python
机器学习经典算法-logistic回归代码详解
2017/12/22 Python
教你利用Python玩转histogram直方图的五种方法
2018/07/30 Python
在Pycharm中执行scrapy命令的方法
2019/01/16 Python
python 实现读取csv数据,分类求和 再写进 csv
2020/05/18 Python
以色列的身体护理及家居香薰品牌:Sabon NYC
2018/02/23 全球购物
巴西备受欢迎的服装和生活方式品牌:FARM Rio
2020/02/04 全球购物
经理职责范文
2013/11/08 职场文书
装修致歉信
2014/01/15 职场文书
高一地理教学反思
2014/01/18 职场文书
小学敬老月活动方案
2014/02/11 职场文书
工作迟到检讨书
2014/02/21 职场文书
事业单位个人查摆问题及整改措施
2014/10/28 职场文书
2015年五四青年节演讲稿
2015/03/18 职场文书
锦旗赠语
2015/06/23 职场文书
2016年度继续教育学习心得体会
2016/01/19 职场文书
2016年“我们的节日·清明节”活动总结
2016/04/01 职场文书
nginx之queue的具体使用
2022/06/28 Servers