Question

I’m looking how to solve this issue. What I have:

• Grid panel
• Cell renderer
• Cell editor – combobox

My renderer is:

renderer: function(value) {
    return value || "—";
}

So if value parameter is defined it’ll be displayed, otherwise we’ll display –.

Editor is:

editor: {
    xtype: "combobox",
    store: Ext.create("Ext.data.Store", { ... }),
    displayField: "name",
    valueField: "id",
    queryMode: "local"
}

And when editing is finished value from valueField will be returned and pushed into renderer as parameter, so I’ll see entry’s ID in the cell.

My problem is that I want to display value from displayField in the cell (push it into renderer), but record should contains entry’s ID (valueField value).

Thanks in advance.

Answer 1

If docs for renderer are correct the third argument passed into renderer is record. You can modifie it (set ‘ID’) in renderer:

renderer: function(value, meta, record) {
  // value == valueField
  record.set('ID', value);

  var displayValue;
  // displayValue (corresponding to valueField) can be retrieved from combo's store:
  displayValue = combosStore.find('id', value).get('name');
  return displayValue || "—";
}