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;}