Extjs如何调取多选下拉框 multicombobox 中的返回赋值问题
在使用Ext.js 中遇到的问题
背景
Ext.js 版本是4.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',
'{country} {province}{city} {popedom}{company}{department}{team}{person}{name}{type}{text}{typeName}{sizeName}'),//这边value的要改成下拉框显示所对应的displayField字段,例如:values。name
onItemSelect: function (record) {
var node = this.getNode(record);
if (node) {
Ext.fly(node).addCls(this.selectedItemCls);
var checkboxs = node.getElementsByTagName("input");
if (checkboxs != null) {
var checkbox = checkboxs[0];
checkbox.checked = true;
}
}
},
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();
},
selectAll: function () {
}
});
{
xtype: 'multicombobox',
multiSelect: true,//支持多选
name: 'allGoods.size',
itemId: 'goodsSizeId',
triggerAction: 'all',
minChars: 1,
fieldLabel: saleLanguage.sale_size,
labelAlign: 'right',
editable: false,
hidden: !public_industrySettingC,
store: {
xtype: 'store',
fields: ['sizeName'],
proxy: {
type: 'ajax',
url: 'goodsSizelist.action',
reader: {
type: 'json',
root: 'array',
totalProperty: 'total'
}
},
autoLoad: true
},
displayField: 'sizeName',
valueField: 'sizeName',
},
正常再前端选择的时候是能正常选中的,但是后端获取的值赋值到前端时却无法使多选款选中
combo.setValue(text.sizeName); 这种无法使多选框选中
因为多选框中的选中时是通过一个个选中的形式赋值的,匹配选择同样需要一个个匹配,因此只能使用
combo.setValue(text.sizeName.split(",")); 分割成数组的形式进行赋值就可以多选选中了
好记性不如烂笔头,每天记录一个bug