extjs的EditorGridPanel中的ComboBox列中显示值的问题

在项目中使用了extjs的editorgridpanel,但是其中的combobox在选择了相应的选项后，grid中显示的是值域(valueField)的值，而非意愿中的显示域(displayField)的值，经过一些搜索和尝试后找到了一个比较好的解决方法——在定义带combobox的列时配置其renderer的属性。 

Extjs代码  

1. var assistItemStore = new Ext.data.JsonStore({  
2.                                 url:'assist.do',  
3.                                 baseParams:{  
4.                                     m : 'listAllLike',  
5.                                     shopid: shopid ,  
6.                                     subid: subid  
7.                                 },  
8.                                 root:'items',  
9.                                 fields:[{  
10.                                     name:'aux_name',  
11.                                     mapping:'assistName'  
12.                                 },{  
13.                                     name:'aux_id',  
14.                                     mapping:'assistid'  
15.                                 }]  
16.                             });  

Extjs代码  

1. {  
2.                         header :'项目名称',  
3.                         width :100,  
4.                         dataIndex :'aux_id',  
5.                         editor : new Ext.form.ComboBox({  
6.                             autoLoad:true,  
7.                             triggerAction : 'all',  
8.                             selectOnFocus : true,  
9.                             allowBlank : true,  
10.                             editable: true,  
11.                             displayField:'aux_name',  
12.                             valueField:'aux_id',  
13.                             minChars:1,  
14.                             queryParam:'subname',  
15.                             typeAhead: true,  
16.                             store: assistItemStore  
17.                         }),  
18.                         renderer: function(value,metadata,record){  
19.                             var index = assistItemStore.find('aux_id',value);  
20.                             if(index!=-1){  
21.                                 return assistItemStore.getAt(index).data.aux_name;  
22.                             }  
23.                             return value;  
24.                         }  

这样写之后，选择之后grid中显示了displayField的值，但最初从数据库提取的值仍然显示valueField的值，原因是store的数据是远程取得的，在grid最初的render中还无法从store中查到相对应的displayField的值,于是打算用ajax异步取得displayField的值,但是异步的线程不造成阻塞,无法保证返回值之前能取得相应的数据.后来想出另一个方法,为grid增加一个隐藏列,存放对应的值,在最初提取数据时能够从中获取要显示的值. 

Extjs代码  

1. {  
2.                         header:'',  
3.                         width:10,  
4.                         dataIndex:'aux_name',  
5.                         hidden:true  
6.                     }, {  
7.                         header :'项目名称',  
8.                         width :100,  
9.                         dataIndex :'aux_id',  
10.                         editor : new Ext.form.ComboBox({  
11.                             autoLoad:true,  
12.                             triggerAction : 'all',  
13.                             selectOnFocus : true,  
14.                             allowBlank : true,  
15.                             editable: true,  
16.                             displayField:'aux_name',  
17.                             valueField:'aux_id',  
18.                             minChars:1,  
19.                             queryParam:'subname',  
20.                             typeAhead: true,  
21.                             store: assistItemStore  
22.                         }),  
23.                         renderer: function(value,metadata,record){  
24.                             var index = assistItemStore.find('aux_id',value);  
25.                             if(index!=-1){  
26.                                 return assistItemStore.getAt(index).data.aux_name;  
27.                             }  
28.                             return record.get('aux_name');  
29.                         }  

总感觉这个编辑框太小了,用着很不舒服,希望改进.