Reputation: 416
I'm currently working on a message box that when you click on a message (list displayed in a grid), that message will then display in a Panel.
That aspect of this is working, however when the Grid first loads, I want to automatically load the first item in the Grid into the Panel.
My idea for how to approach this was to select the first item from the grid, and fire the 'click' event on it.
Thus far I have not been able to find a way to select the first item out of a grid.
I'm using ExtJS 4.2.4
In My controller I have the following:
init: function(){
this.control({
afterrender: this.setupGrid
});
},
setupGrid: function(grid)
{
grid.getStore().load();
//console.log(grid.getSelectionModel().select(0)); // Uncaught TypeError: Cannot read property 'id' of undefined.
//console.log(this.grid.getSelectionModel().selectFirstRow()); // Uncaught TypeError: Cannot read property 'getSelectionModel' of undefined
}
I've tried, Columns (Gives me the column headers), I've tried 'Child', and several approaches I found on here on stacks, but still don't seem to be able to pull this off. Any help is greatly appreciated :)
Upvotes: 0
Views: 570
Reputation: 74096
You can wait for the store to load and then select the first record:
setupGrid: function(grid) {
grid.store.on('load', function(store){
grid.getSelectionModel().select(store.first());
}, this);
}
Upvotes: 2