extjs 多选下拉 3.2

Ext4.0下拉框 必须写name否则出现只能选择一次的效果
//多选下拉框
Boat.UI.MultiSelect = Ext.extend(Boat.UI.SingleSelect, {
    tpl: '<div class="multiselect"></div>',
    // private
    initList: function() {
        Boat.UI.MultiSelect.superclass.initList.call(this);
        this.initCheckBox();
    },
    // private
    initCheckBox: function() {
        var ct = this.innerList.first('.multiselect');
        this.items = new Ext.util.MixedCollection();
        var fn = function(r) {
            var c = new Ext.form.Checkbox({
                boxLabel: r.data[this.displayField],
                inputValue: r.data[this.valueField],
                renderTo: ct
            });
            this.items.add(c);
        };
        this.store.each(fn, this);
        this.on('collapse', this.onCollapse, this);
    },
    onCollapse: function() {
        var value = [];
        var fn = function(c) {
            if (c.getValue()) {
                value.push(c.el.dom.value);
            }
        };
        this.items.each(fn);
        this.setValue(value);
    },
    setValue: function(v) {
        if (!Ext.isArray(v)) { v = [v]; }
        this.hiddenField.value = v;
       Ext.form.ComboBox.superclass.setValue.call(this, this.getTexts(v));
        this.value = v;
    },
    getTexts: function(v) {
        var texts = [];
        var fn = function(r) {
            var rv = r.data[this.valueField];
            if (v.indexOf(rv) > -1) {
                texts.push(r.data[this.displayField]);
            }
        };
        this.store.each(fn, this);
        return texts.join();
    },
    afterExpand: function() {
        this.items.reset();
        if (!Ext.isArray(this.value) || this.value.length == 0) { return; }
        var v = this.value;
        this.items.each(function(item) {
            var rv = item.el.dom.value;
            if (v.indexOf(rv) > -1) {
                item.setValue(true);
            }
        });
    }
});
Ext.reg('multiselect', Boat.UI.MultiSelect);
CSS:
	1. 
.multiselect .x-form-check-wrap{float:left;margin:3px;}

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值