Extjs EditorGridPanel中ComboBox列的显示问题

       EditorGridPanel中嵌入ComboBox通常不会正常显示ComboBox的store中本想显示字段，而是显示的EditorGridPanel中 store的dataindex指定的字段内容。

       为了解决这个问题需要在EditorGridPanel的ColumnModel中显示ComboBox的地方使用renderer属性，重新渲染，方法如下：

//部门列表var comboxDepartmentStore = new Ext.data.Store({proxy: new Ext.data.HttpProxy({url: "GetDepartmentJson.aspx",method: 'GET'}),reader: new Ext.data.JsonReader({root: 'data',totalProperty: 'totalCount',fields: [{ name: 'departmentid', mapping: 'ID' },{ name: 'departmentname', mapping: 'Name' }]})});//根据Combobox列表中对应的Id的值来渲染function rendererMeterTypeCombobox(value, p, r) {var index = comboxDepartmentStore.find(Ext.getCmp('cbdepartment').valueField, value);var record = comboxDepartmentStore.getAt(index);var displayText = "";if (record == null) {return value;} else {return record.data.astype; // 获取record中的数据集中的display字段的值 }}var sm = new Ext.grid.CheckboxSelectionModel();var cm = new Ext.grid.ColumnModel({columns: [sm, new Ext.grid.RowNumberer(), {header: 'id',dataIndex: 'id',hidden: true}, {header: '姓名',width: 40,dataIndex: 'name'}, {header: '所属部门',width: 80,dataIndex: 'department',renderer: rendererDepartmentCombobox,editor: new Ext.form.ComboBox({id: "cbdepartment", //必须有 forceSelection: true,selectOnFocus: true,typeAhead: true,triggerAction: 'all',store: comboxDepartmentStore,mode: 'local',displayField: 'departmentname',valueField: 'departmentid',lazyRender: true})}],defaults: {zsortable: true,menuDisabled: false,width: 100}});var editGrid = new Ext.grid.EditorGridPanel({id: 'TestGrid',store: store, //EditorGridPanel使用的storetrackMouseOver: true,disableSelection: false,clicksToEdit: 1, //设置点击几次才可编辑loadMask: true,autoHeight: true,cm: cm,sm: sm,viewConfig: {columnsText: '显示/隐藏列',sortAscText: '正序排列',sortDescText: '倒序排列',forceFit: true,enableRowBody: true},bbar: new Ext.PagingToolbar({pageSize: 25,store: store,displayInfo: true,displayMsg: '当前显示从{0}至{1}， 共{2}条记录',emptyMsg: "当前没有记录"})});

转载于:https://www.cnblogs.com/jadebug/archive/2011/07/02/2096167.html

总结

以上是生活随笔为你收集整理的Extjs EditorGridPanel中ComboBox列的显示问题的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。