View Full Version : weird interaction between ComboBox and CheckColumn

17 Nov 2009, 7:13 AM
OK, here's the setup.

1) I have two cells in a given row, one being a ComboBox and the other being an implementation of the CheckColumn plugin.
2) For the most part, the columns work as intended. However, at some point clicking on the checkbox created by the CheckColumn causes the ComboBox field to appear blank. After clicking on the field to reveal the cellEditor (ComboBox), the value that should be mapped to valueField is displayed, rather than the expected displayField. See the attached screenshot for an example.

19 Nov 2009, 1:11 PM
I realized I forgot a detail that might be important.

The implementation I have going requires that different values be passed to the row's ComboBox store (different rows will need different values to choose from). I achieved this by listening for the selection of a cell, extracting pertinent values from the row the selected cell's a member of, and passing those to the ComboBox store's baseParams. The process is reproduced below.

Any tips on correcting my process would be immensely appreciated!

sm: new Ext.grid.CellSelectionModel({
listeners: {
cellSelect: function(sm,row,col) {
record = myGrid.getStore().getAt(row);
seq1 = record.get("seq1");
seq2 = record.get("seq2");
cboxCol = myGrid.getColumnModel().getColumnById("cbox");
tgtStore = cboxCol.getCellEditor(row).field.getStore();
tgtStore.setBaseParam("param1", seq1);
tgtStore.setBaseParam("param2", seq2);

30 Nov 2009, 6:45 AM
I've verified that this weird behaviour also happens when I just use the built-in Ext.form.Checkbox.

header: 'Closeout',
dataIndex: 'closeout',
editor: new Ext.form.Checkbox({


Here's my function that makes the ComboBox (this is done because of the assumption that this type of column/editor combo will be used elsewhere):

function createCBox(gridID, feeColID) {
return new Ext.form.ComboBox({
typeAhead: false,
triggerAction: 'all',
valueField: 'financefeeseq',
displayField: 'financefeedesc',
forceSelection: true,
lazyInit: false,
editable: false,
//resizable: true,
//minListWidth: 200,
listWidth: 200,
store: new Ext.data.JsonStore({
url: "myFeeTypes_lookup.cfm",
root: "data",
totalProperty: "recordcount",
fields: [{
name: 'financefeeseq'
name: 'financefeedesc'
name: 'financefee'

listeners: {
beforequery: function (e) {
delete e.combo.lastQuery;
select: function (cbox, r, i) {
grid = Ext.ComponentMgr.get(gridID);
gridStore = grid.getStore();
record = gridStore.getAt(grid.getSelectionModel().getSelectedCell()[0]);
record.set("productfee", cbox.getStore().getAt(i).get("financefee"));

Slightly off-topic: this sorta warrants a thread title change. What do I need to do to get something like that done?