Ext表单中的combobox回填显示值问题-优快云博客

本文介绍如何在ExtJS中解决Combobox组件在修改页面中值回填的问题，确保显示正确的内容而非valueField值。通过为store添加监听器来实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

[b]缘由：[/b]在基于Ext构建的表单(form)中使用了Combobox组件，提交时使用hiddenName方式，后台可接收到所选的valueField值，实现保存功能。
[b]问题：[/b]在修改页面中须将值回填到combobox中，但combobox显示的是valueField值而不是displayField值。解决的办法是在combobox的store中添加listener回填显示值。

[b]解决问题所添加代码：[/b]


listeners: {  
      load: function() {  
           typeCombo.setValue(typeCombo.getValue());  
      }  
}

[b]完整代码：[/b]

 var typeStore = new Ext.data.JsonStore({
		    url: 'systemParmsProvider.do?type=DATA_TABLE_TYPE_LIST',
		    fields: ['codeValue', 'codeLabel'],
		    listeners: {  
				load: function() {  
					typeCombo.setValue(typeCombo.getValue());  
				}  
			}  
		});
		typeStore.setDefaultSort('codeValue');

	    var typeCombo = new Ext.form.ComboBox({
	        store: typeStore,
			fieldLabel: '类型',
	        displayField: 'codeLabel',
	        valueField: 'codeValue',
	       	name: 'type',
	       	hiddenName: 'type',
	        typeAhead: true,
	        emptyText:'请选择数据表类型...',
	        mode: 'local',
	        triggerAction: 'all',
	        selectOnFocus: true,
	        editable: false,
		    anchor:'95%'
	    });
	    typeStore.load();