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 相关文章推荐
javascript 数组排序函数
Aug 20 Javascript
解析Jquery的LigerUI如何实现文件上传
Jul 09 Javascript
tangram框架响应式加载图片方法
Nov 21 Javascript
js截取固定长度的中英文字符的简单实例
Nov 22 Javascript
跟我学习javascript的循环
Nov 18 Javascript
JS触发服务器控件的单击事件(详解)
Aug 06 Javascript
vue2 前后端分离项目ajax跨域session问题解决方法
Apr 27 Javascript
使用Vue-cli 3.0搭建Vue项目的方法
Jun 07 Javascript
vue2.0父子组件间传递数据的方法
Aug 16 Javascript
vue根据进入的路由进行原路返回的方法
Sep 26 Javascript
jQuery插件实现非常实用的tab栏切换功能【案例】
Feb 18 jQuery
深入理解Node内建模块和对象
Mar 12 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自动跳转中英文页面
2008/07/29 PHP
joomla内置的表单验证功能使用方法
2010/06/11 PHP
功能强大的PHP POST提交数据类
2016/07/15 PHP
PHP实现的网站目录扫描索引工具
2016/09/08 PHP
PHP foreach遍历多维数组实现方式
2016/11/16 PHP
jQuery toggle()设置CSS样式
2009/11/05 Javascript
JavaScript OOP类与继承
2009/11/15 Javascript
javascript下高性能字符串连接StringBuffer类
2010/08/16 Javascript
Javascript学习笔记-详解in运算符
2011/09/13 Javascript
jquery ajax 局部刷新小案例
2014/02/08 Javascript
Jquery实时监听input value的实例
2017/01/26 Javascript
angular中子控制器向父控制器传值的实例
2018/10/08 Javascript
微信小程序实现的一键拨号功能示例
2019/04/24 Javascript
Vue中全局变量的定义和使用
2019/06/05 Javascript
Node.js API详解之 zlib模块用法分析
2020/05/19 Javascript
微信小程序地图实现展示线路
2020/07/29 Javascript
JS如何操作DOM基于表格动态展示数据
2020/10/15 Javascript
python中关于日期时间处理的问答集锦
2013/03/08 Python
Django自定义认证方式用法示例
2017/06/23 Python
django项目运行因中文而乱码报错的几种情况解决
2017/11/07 Python
VSCode Python开发环境配置的详细步骤
2019/02/22 Python
pyqt 实现在Widgets中显示图片和文字的方法
2019/06/13 Python
python多任务之协程的使用详解
2019/08/26 Python
Python面向对象程序设计之静态方法、类方法、属性方法原理与用法分析
2020/03/23 Python
python变量的作用域是什么
2020/05/26 Python
如何让python的运行速度得到提升
2020/07/08 Python
详解Python中string模块除去Str还剩下什么
2020/11/30 Python
使用CSS3滤镜的filter:blur属性制作毛玻璃模糊效果的方法
2016/07/08 HTML / CSS
HTML5中在title标题标签里设置小图标的方法
2020/06/23 HTML / CSS
纽约通行卡:The New York Pass(免费游览纽约90多个景点)
2017/07/29 全球购物
夏洛特和乔治婴儿和儿童时装精品店:Charlotte and George
2018/06/06 全球购物
丝芙兰加拿大官方网站:SEPHORA加拿大
2018/11/20 全球购物
消防安全承诺书
2014/05/22 职场文书
法人委托书的范本格式
2014/09/11 职场文书
2015年综治宣传月活动总结
2015/03/25 职场文书
《我要的是葫芦》教学反思
2016/02/18 职场文书