How to reset a grid coliumn combo box data store

[Michael710]

Hi,

I have a grid and I would like to reset the datastore for column that contains a combo box. (I have a master detail form and this is the child grid. When rewriting the child data on selection of new master record I would also like to repopulate the combo box in the child grid. I don't want to repaint the whole grid if possible.)

My gird column code in column 4 of the grid is:

{ header:'FieldName', dataIndex:'FieldName', width: 100, editor:
{ xtype: 'combobox',
typeAhead: true,
selectOnTab: true,
triggerAction: 'all',
fields:['id','value'],
store: fieldStore,
valueField:'id',
displayField:'value',
multiSelect: false,
lazyRender: false,
listClass: 'x-combo-list-small'},
renderer: function(val) { var CodesStore = Ext.create('Ext.data.Store', { fields: [ {name: 'id'}, {name: 'value'} ], data: bssFieldNameData }); var matching = CodesStore.queryBy( function(rec){ return rec.data.id == val; }); return (matching.items[0]) ? matching.items[0].data.value : ''} },

my fieldStore is:

bssFieldNameData = [ { id:1, value: 'AGLOBAL'},{ id:2, value: 'AUSER'}];


fieldStore = Ext.create('Ext.data.Store', {
fields: [{name: 'id'}, {name: 'value'} ],
data: bssFieldNameData
}
);


I have tried to do:

bssNewFieldNameData = [{ id:1, value: 'BGLOBAL'},{ id:2, value: 'BUSER'}];
fieldStore.loadData(bssNewFieldNameData,false);

and have had some limited results but it does not work the way it should. Is there a better process for doing this?

Thanks,

Mike.

[scottmartin]

I believe the problem is that you are creating your store in your renderer

regards,
Scott.

[Michael710]

I have removed the codeStore in the renderer but its still acting odd. (I thought it would work also.) Basically it seems that I need to drop down and render first before I can reload the data. I was hoping it would be the other way around. So right now I run the code to reload the store and then go to the grid and the new data is not there when I drop down. Then I run the code again and its there. If I drop down first without running the code and then run it it works.

I have tried the following to no avail. It almost like I need a function like:

childgrid.columns[4].renderer.store.load(). or something like that after I change the data in the store.

If I have to I will just replace the grid but was hoping to avoid that.

Thanks,


{ header:'FieldName', dataIndex:'FieldName', width: 100,
focus: function() {alert('here i am'); fieldStore.loadData(bssNewFieldNameData,false);},
editor:
{ xtype: 'combobox',
typeAhead: true,
selectOnTab: true,
triggerAction: 'all',
fields:['id','value'],
store: fieldStore, //[[1, 'GLOBAL'],[2, 'USER']],
valueField:'id',
displayField:'value',
multiSelect: false,
lazyRender: true,
listClass: 'x-combo-list-small'},
renderer: function(val) {fieldStore.loadData(bssNewFieldNameData,false); var matching = fieldStore.queryBy( function(rec){ return rec.data.id == val; }); return (matching.items[0]) ? matching.items[0].data.value : ''} },

[Michael710]

The issue is with the queryMode. It defaults to remote. Basically the way I am loading the store dynamically at runtime is better served by 'local'. I found this in a different thread.

So adding: queryMode: 'local' resolves this issue.


{ header:'FieldName', dataIndex:'FieldName', width: 100,
editor:
{ xtype: 'combobox',
typeAhead: true,
selectOnTab: true,
triggerAction: 'all',
fields:['id','value'],
store: fieldStore, //[[1, 'GLOBAL'],[2, 'USER']],
valueField:'id',
displayField:'value',
multiSelect: false,
queryMode: 'local',
lazyRender: true,
listClass: 'x-combo-list-small'},
renderer: function(val) {var matching = fieldStore.queryBy( function(rec){ return rec.data.id == val; }); return (matching.items[0]) ? matching.items[0].data.value : ''} },