ext combobox editgrid

My solution to this problem is as follows:
I would like to get both the display text and the value text.
1)Define the comboBox
Code:
var displayTextCB = new Ext.form.ComboBox({
   typeAhead: true,
   mode: 'local',
   triggerAction: 'all',
   transform:'displayTextSel',
   selectOnFocus:true,
   lazyRender:true,
   listClass: 'x-combo-list-small'
    });)
Define two column field used for comboBox when new ColumnModel, one used for display only and the other contain the exact value.
Code
{
           header: "Display Text",
           dataIndex: 'displayText',
           width: 130,
           renderer: displayTextLabelValue,
           editor: displayTextCB
        },
        {
        header:"Display Value",
        dataIndex: 'displayValue',
        hidden: true
        },
3)Define render function on the display field,say displayTextLabelValue
which has two function:
a) return the text to the display Name with combobox
b) set value to the hidden diaplay value
Code:
function displayTextLabelValue(val, params, record){
//store value in hidden column
var opts = displayNameCB.store.data.items;
for(var i = 0, len = opts.length;i < len; i++){
if (opts[i].data.value == val){
record.data.displayValue=val;
return opts[i].data.text;
}
}
return val;
};

or

Then in the 'afteredit' event of the grid I add/update the value to the record

Code:
grid.on('afteredit', function(o){
if(o){
var grid=o.grid;
var record=o.record;
var cm=grid.getColumnModel();
var editor=cm.getCellEditor( o.column, o.row);
var v=editor.getValue();

if(editor.field.hiddenField){
var v=editor.field.hiddenField.value;
record.set('selected', v);
}
}
});Finally, when you get modified records the value is there
Code:
Ext.getCmp('saveButton').on('click', function(...){
  var grid=Ext.getCmp('dispatchlogic_grid');
  var modified=grid.getStore().getModifiedRecords();
  for(var i=0;i<modified.length;++i){
  }
});