ExtJS 下拉多选框lovcombo |
|
本文标签：ExtJS,多选框 开始以为很简单，在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 { //未选中 } } |
