在Extjs项目中我们经常用到EditorGridPanel。在相关的列字段中编辑相关的值然后提交到后台。只是在遇到Combobox作为Editor的时候.在更改编辑之后显示的值是ValueField而不是DisplayField这不是我们愿意看到的

1、Gridpanel中的cm声明代码.注意看[所属分店]声名的Editor:

var cm = new Ext.grid.ColumnModel({   
            defaults : {  
                sortable : true,  
                width : (centertabs.getInnerWidth()-10)/10  
            },  
            columns : [sm,{  
                header : '部门ID',  
                dataIndex : 'deptId',  
                hidden : true  
            },{  
                header : '所属分店ID',  
                dataIndex : 'branchId',  
                hidden : true  
            },{  
                header : '所属分店',  
                dataIndex : 'branchName',  
                width: 100,  
                editor : branchbox,  
                id : 'branchcombo',
                renderer : Ext.DongWan.comboRenderer(branchbox)
                  
            },{  
                header : '部门名称',  
                dataIndex : 'deptName',  
                editor : new Ext.form.TextField({  
                    allowBlank : false  
                })  
            }, {  
                header : '部门备注',  
                dataIndex : 'deptRemark',  
                editor : new Ext.form.TextField({  
                    allowBlank : false  
                })  
            },{  
                header:'创建时间',  
                dataIndex:'createTime',  
                renderer : function(value){     
                        if(value instanceof Date){     
                            return new Date(value).format("Y-m-d");     
                        }else{     
                            return value;     
                        }    
                },  
                editor : new Ext.grid.GridEditor(  
                            new Ext.form.DateField({  
                                    format:'Y-m-d',  
                                    type:'date'  
                                    }))  
            }]  
        });

我们要显示DisplayField的值就要用到上面的这个方法:

renderer : Ext.DongWan.comboRenderer(branchbox)

3、renderer : Ext.DongWan.comboRenderer(branchbox)方法

 //下拉框格式化
        comboRenderer : function(combo) {  
		    return function(value) {  
		        var record = combo.findRecord(combo.valueField, value);  
		          
		        return record  
		                ? record.get(combo.displayField)  
		                : value;  
		    }  
		}