Ext.form.ComboBox加载json时刻默认选中的解决
重写combo的setValue
Js代码
Ext.override(Ext.form.ComboBox, {
setValue : function(node) {
if (typeof node == "object") {
// 当node为object对象时
this.lastSelectionText = node.text;
this.setRawValue(node.text);
if (this.hiddenField) {
this.hiddenField.value = node.id;
}
this.value = node.id;
return this;
} else {
// 当node为文本时
var text = node;
if (this.valueField) {
var r = this.findRecord(this.valueField, node);
if (r) {
text = r.data[this.displayField];
} else if (Ext.isDefined(this.valueNotFoundText)) {
text = this.valueNotFoundText;
}
}
this.lastSelectionText = text;
if (this.hiddenField) {
this.hiddenField.value = node;
}
Ext.form.ComboBox.superclass.setValue.call(this, text);
this.value = node;
return this;
}
}
})
为什么要这样重写请参考ExtJS3 下拉树TreeComboBox的修改
然后在传递过来的json中改为
Js代码
{
'success' : true,
data : {
'yhId' : 227,
'yhXm' : '赵刚',
'yhXh' : {text: '赵刚',id: '227'},
}
}
yhXh传递过来不再是文本或数字,而是一个object,为了与下拉树的统一,这里使用text和id来命名文本和参数值
这样在combo默认调用setValue的时候就会自动将值写入到选择框内,但是这只解决了初值赋予的问题,因为我的combo内的选项是自expand的时候才加载的,那么怎样在expand的时候也默认选中默认的选项呢?
Js代码
xtype : 'combo',
id : 'Ext.Strong.tyh.combo.yhXh',
fieldLabel : '显示在',
hiddenName : 'yhXh',
allowBlank : false,
mode : 'remote',
readOnly : true,
triggerAction : 'all',
store : new Ext.data.JsonStore({
url : '<@s.url action="tyh_LieBiao_XianShi!json"/>',
fields : new Ext.data.Record.create(['yhXm', 'yhId']),
root : 'list',
// 设置监听 当加载完成后选中当前记录
listeners : {
load : function() {
var comb = Ext.getCmp('Ext.Strong.tyh.combo.yhXh');
comb.setValue(comb.hiddenField.value);
}
}
}),
editable : false,
valueField : 'yhId',
displayField : 'yhXm'
修改store的默认load监听事件,在combo expand的时候重新setValue一下,由于这里set进去的不再是object对象,所有会调用正常的set过程将选项选中
原文来自:雨枫技术教程网 http://www.fengfly.com
原文网址:http://www.fengfly.com/plus/view-168949-1.html