Extjs4.2 多选下拉框

//多选下拉框
Ext.define(‘MDM.view.custom.MultiComboBox‘, {
    extend: ‘Ext.form.ComboBox‘,
    alias: ‘widget.multicombobox‘,
    xtype: ‘multicombobox‘,
    initComponent: function() {
        this.multiSelect = true;
        this.listConfig = {
            itemTpl: Ext.create(‘Ext.XTemplate‘,
‘<input type=checkbox>{‘ + this.displayField + ‘}‘),
            onItemSelect: function(record) {
                var node = this.getNode(record);
                var count = this.getStore().data.length;
                if (node) {
                    Ext.fly(node).addCls(this.selectedItemCls);
                    var checkboxs = node.getElementsByTagName("input");
                    if (checkboxs != null) {
                        var checkbox = checkboxs[0];
                        checkbox.checked = true;
                    }
                }
            },
            onItemDeselect: function(record) {
            var node = this.getNode(record);
            var count = this.getStore().data.length;
            if (node) {
                Ext.fly(node).removeCls(this.selectedItemCls);
                var checkboxs = node.getElementsByTagName("input");
                if (checkboxs != null) {
                    var checkbox = checkboxs[0];
                    checkbox.checked = false;
                }
            }
            },
            listeners: {
                itemclick: function(view, record, item, index, e, eOpts) {
                    var isSelected = view.isSelected(item);
                    var checkboxs = item.getElementsByTagName("input");
                    if (checkboxs != null) {
                        var checkbox = checkboxs[0];
                        if (!isSelected) {
                            checkbox.checked = true;
                        } else {
                            checkbox.checked = false;
                        }
                    }
                }
            }
        }
        this.callParent();
    }
});

  

时间: 2024-12-14 19:28:22

Extjs4.2 多选下拉框的相关文章

ExtJs5.1多选下拉框CheckComb

ExtJs这么多个版本了,可就是不提供多选下拉框,老外不用这个玩意吗? 5都出来这么久了,新写的项目就用5吧,把以前Extjs4.2的时搜到前人的CheckComb改巴改巴,能用了就赶紧贴上来,没有仔细测试各种情况. Ext.define('Ext.ux.CheckCombo', { extend : 'Ext.form.field.ComboBox', alias : 'widget.checkcombo', multiSelect : true, allSelector : false, n

query多选下拉框插件 jquery-multiselect(修改)

其实网上关于该控件的使用教程已经很多了,其中 query多选下拉框插件 jquery-multiselect Jquery多选下拉列表插件jquery multiselect功能介绍及使用 这2个的介绍已经比较详细了,尤其是第二个有扩展MyValues函数,只是扩展有些bug,这里我在提出一些我的扩展,我们应该把multiValues属性定义在options里面,让每个multiselect控件都有自己的multiValues属性.我这里还需要一个获取text的方法.有关Myvalues和Myt

多选下拉框带搜索(aps.net)

自己写了一个带搜索功能的多选下拉框,为了要获取值,就没有封装插件,实现思路 1.一个文本框 做搜索 2.一个文本框显示选中文本,一个隐藏控件存值 3.一个div里面绑定CheckBoxList控件(这里,你也可以请求后直接插入checkbox) 代码 1.一个变量把div的html存起来 2.选中就加到文本框,取消就减掉 //选中记录,反选删除 $("#divChkList :checkbox").each(function () { $(this).click(function ()

Html 多选下拉框

1.css文件 span.dropList {display:inline-block; height:20px;border:1px solid #ccc;  cursor:pointer; background:url(../images/xj.png) #fff no-repeat center right; font-size:12px; line-height:20px;padding-right:10px; position:relative;} span.dropList .Che

页面多选下拉框 jquery.multiple.select

1.首先引用jquery.multiple.select.js.multiple-select.css 2.在页面select下拉列表里面加一个multiple="multiple" <select name="nimbusHost" id="nimbusHost" multiple="multiple"> <c:forEach items="${stormIps}" var="

MVC实现多选下拉框

借助Chosen Plugin可以实现多选下拉框. 选择多项: 设置选项数量,比如设置最多允许2个选项: 考虑到多选下拉<select multiple="multiple"...></select>选中项是string数组,Model应该这样设计: using System.Collections.Generic; using System.Web.Mvc; namespace MvcApplication1.Models { public class Car

c# 复选下拉框

引用dll: http://pan.baidu.com/s/1qXa97UO 自定义类: namespace TMI_S { /// <summary> /// 功能描述:自定义多选下拉框 /// 作 者:huangzh /// 创建日期:2016-01-04 11:57:13 /// 任务编号: /// </summary> public class MultiComboBox : ComboBox { public TreeView lst = new TreeView();

自定义SWT控件二之自定义多选下拉框

2.自定义下拉多选框 package com.view.control.select; import java.util.ArrayList; import java.util.HashMap; import java.util.LinkedHashMap; import java.util.List; import java.util.Map; import org.eclipse.swt.SWT; import org.eclipse.swt.custom.CLabel; import or

select2的多选下拉框上传

1.加入multiple: true,属性实现多选下拉框样式 2.下拉框选择后的值是数组类型不要经过数据处理才能进行表单提交 提交的时候原下拉框所在的标签不提交,而是将多选后的值存入页面中的一个隐藏标签中,将这个隐藏标签进行提交 提交时获取选中的下拉框的所有的值,并遍历这些值,将这些值分别以(值 逗号)的形式存入一个变量中,并在遍历完成后去掉最后一个逗号, 最终的格式类似  1,4,6,7 这样 页面初始化时,假如值传入,就将数据处理成数组并通过&(“#aa”).val(arr).trigger