ExtJS 下拉多选框lovcombo


Posted in Javascript onMay 19, 2010

开始以为很简单,在option里加个input checkbox就行了。哪知行不通,网上搜了一些实现方法,主要是用div层来模拟下拉。本想照着这种思路,再结合这个项目具体应用自己写一个,发现太麻烦了。刚好在另外一个项目中使用extjs,找到了一个扩展lovcombo,学习了一下它自带的例子(配合2.3版的extjs,3.x版的貌似有问题)。例子倒不难,关键是要把它添加到现有的代码中,并且尽量少的改动原有代码。

下拉多选框的使用过程中处理比较多的逻辑主要集中在数据源store的配置和select事件的处理。extjs本身的那种数据和UI分离的模式使得级联的实现非常轻松。只需在省份下拉框的select事件中去更新城市下拉框的store即可。一个需要注意的小地方是:一个选项被select时,需要额外的通过checkField的值来判断该选项是被选中还是被取消。还有就是全选、取消全选(这两个lovcombo自带有方法selectAll和deselectAll)以及被选中选项数目(需要遍历一遍store,并检测每一项的checkField值)。

//下拉框的select事件 
select:function(combo, record, index) 
{ 
//选中 
if(record.get(this.checkField)) 
{ 
//选中时的处理逻辑 
} 
else 
{ 
//未选中 
} 
}
Javascript 相关文章推荐
用脚本调用样式的几种方法
Dec 09 Javascript
js数组的基本操作(很全自己整理的)
Oct 16 Javascript
javascript判断css3动画结束 css3动画结束的回调函数
Mar 10 Javascript
Javascript中的call()方法介绍
Mar 15 Javascript
jquery实现鼠标滑过后动态图片提示效果实例
Aug 10 Javascript
jQuery实现带滑动条的菜单效果代码
Aug 26 Javascript
jquery仿ps颜色拾取功能
Mar 08 Javascript
JS module的导出和导入的实现代码
Feb 25 Javascript
vue实现抖音时间转盘
Sep 08 Javascript
jQuery实现雪花飘落效果
Aug 02 jQuery
基于JavaScript的数据结构队列动画实现示例解析
Aug 06 Javascript
JavaScript canvas实现文字时钟
Jan 10 Javascript
javascript 得到变量类型的函数
May 19 #Javascript
javascript 跨浏览器开发经验总结(五) js 事件
May 19 #Javascript
js 复制或插入Html的实现方法小结
May 19 #Javascript
15 个 JavaScript Web UI 库
May 19 #Javascript
JavaScript 以对象为索引的关联数组
May 19 #Javascript
JavaScript 语言的递归编程
May 18 #Javascript
JS 树形递归实例代码
May 18 #Javascript
You might like
php 获取全局变量的代码
2011/04/21 PHP
php实现数组按指定KEY排序的方法
2015/03/30 PHP
PHP实现限制IP访问的方法
2017/04/20 PHP
Js之软键盘实现(js源码)
2007/01/30 Javascript
基于jquery的使ListNav兼容中文首字拼音排序的实现代码
2011/07/10 Javascript
页面图片浮动左右滑动效果的简单实现案例
2014/02/10 Javascript
jQuery自定义添加"$"与解决"$"冲突的方法
2015/01/19 Javascript
Angular.js如何从PHP读取后台数据
2016/03/24 Javascript
微信小程序之多列表的显示和隐藏功能【附源码】
2018/08/06 Javascript
JavaScript中this关键字用法实例分析
2018/08/24 Javascript
微信小程序收货地址API兼容低版本解决方法
2019/05/18 Javascript
Python translator使用实例
2008/09/06 Python
Python文件与文件夹常见基本操作总结
2016/09/19 Python
简单实现python聊天程序
2018/04/01 Python
python散点图实例之随机漫步
2018/08/27 Python
Python设计模式之装饰模式实例详解
2019/01/21 Python
Python日期时间Time模块实例详解
2019/04/15 Python
pytorch中torch.max和Tensor.view函数用法详解
2020/01/03 Python
python 解决flask 图片在线浏览或者直接下载的问题
2020/01/09 Python
Python 解决火狐浏览器不弹出下载框直接下载的问题
2020/03/09 Python
python 读取串口数据的示例
2020/11/09 Python
python中uuid模块实例浅析
2020/12/29 Python
Python中对象的比较操作==和is区别详析
2021/02/12 Python
详解H5 活动页之移动端 REM 布局适配方法
2017/12/07 HTML / CSS
HTML5高仿微信聊天、微信聊天表情|对话框|编辑器功能
2018/04/23 HTML / CSS
意大利网上购书网站:Libraccio.it
2021/02/03 全球购物
教育科学研究生自荐信
2013/10/09 职场文书
财务管理专业推荐信
2013/11/19 职场文书
学校后勤岗位职责
2014/02/19 职场文书
“四风”问题自我剖析材料思想汇报
2014/09/23 职场文书
辞职信的写法
2015/02/27 职场文书
公务员处分决定书
2015/06/25 职场文书
公司宣传语大全
2015/07/13 职场文书
军训心得体会范文(2016最新篇)
2016/01/11 职场文书
Python基础详解之邮件处理
2021/04/28 Python
Go调用Rust方法及外部函数接口前置
2022/06/14 Golang