View Full Version : Grid Listener After Records Have Loaded to grid

17 Jul 2013, 2:31 AM
Hey guys,

I'm having a bit of a problem where some rows are being cut off from the end of the grid. In the firebug console I can fix this by running doLayout() on the grid. I'm trying to use this fix automatically but I need some form of listener that tells me that the grid has finished putting all records in.

Is there any listener like this?

I've also tried a callback on the grid store but that doesn't seem to work.

Thanks in advance for any help

17 Jul 2013, 2:53 AM
you can try with the render or refresh events of the grid's view:

grid.getView().on('render', function() {
// call doLayout here

refresh might be fired more frequently than you would like. try with both and see which suits you better.

17 Jul 2013, 3:05 AM
I tried that now but it still doesn't work. It's funny because I have a console.log in the listener to check if it comes after the store is loaded and it does. For some reason it doesn't like having .doLayout coded in automatically.

17 Jul 2013, 3:11 AM
well anyway this was a hack. the grid should work on its own and usually it does. scrollbars should appear when there are more records than the height of the grid. have you set "autoScroll: true" on your grid?

17 Jul 2013, 3:15 AM
The problem is that I've added a button to the renderer of a column. The grid view doesn't take this into account and disregards its height. The solution I have for it now is to set the row height but I was trying to see if I could come up with a fix where the height isn't fixed. I guess that is the only solution.

17 Jul 2013, 3:38 AM
you can try another hack which might force the grid to recalculate its height. In the view's refresh event:


17 Jul 2013, 5:11 AM
That doesn't seem to work for me.

Found out the problem causing this. The button is created with Ext.defer set to 100ms. This means that everything will load and 100ms later it will render the button.

By adding the following to the view refresh listener:

Ext.defer(function() {
}, 100);
It seems to work. Pretty much it just waits 100ms before doing the layout. This fixes the issue and seems to work pretty good.

Thanks for all the help anyway, I wouldn't have got this far without your input.