Reloading a BufferedGrid

[strickjb]

How does one reload a buffered grid and "start from scratch"?

When I reload a buffered grid, I'm forced to scroll outside of the current pageSize until it reloads new data.

Also, if I reload a grid and the totalCount is less than the pageSize then any new reloads don't take effect because I'm unable to scroll outside the pageSize to force a reload.

Does anyone have any tips/tricks to reload a buffered grid w/o any side effects?



Ext.define('My.grid.Panel', {
extend: 'Ext.grid.Panel',
alias: 'widget.mygrid',

verticalScrollerType: 'paginggridscroller',
disableSelection: true,
invalidateScrollerOnRefresh: false,
viewConfig: {
trackOver: true
}
});


Ext.define('My.store.Store', {
extend: 'Ext.store.Store',

model: 'My.model.Model',

buffered: true,
pageSize: 100,
purgePageCount: 0,

proxy: {
type: 'jsonp',

url: 'data.json',

reader: 'json'
}
});


My function to load the grid. (commented out pieces represent a lot of trial/error to get it to work...)


doLoad: function (dateType) {
var grid = this.getGrid(),
store = Ext.StoreMgr.lookup('MyStore');

store.prefetchData.clear();
store.removeAll();

grid.invalidateScroller();

this.filterParams = this.getFilter().getForm().getValues();
this.filterParams.dateType = dateType;
store.getProxy().extraParams = this.filterParams;

store.guaranteeRange(0, store.pageSize - 1);

},

[slemmon]

I'll be interested to know the answer to this question as well.

This is the last I saw:
http://www.sencha.com/forum/showthread.php?143706-4.0.2a-Trouble-refreshing-a-buffered-store

T (http://www.sencha.com/forum/showthread.php?143706-4.0.2a-Trouble-refreshing-a-buffered-store)o be fair, it may be very straightforward in 4.1 Beta 1. I have not yet taken a poke at it.

[strickjb]

I believe I found a suitable work around -



doLoad: function () {

var grid = this.getGrid(),
store = Ext.StoreMgr.lookup('MyStore');

this.filterParams = this.getFilter().getForm().getValues();
store.getProxy().extraParams = this.filterParams;

// Clear out prefetched and loaded data
store.prefetchData.clear();
store.removeAll();

// This is very important - set it back to it's original state
delete store.guaranteedStart;
delete store.guaranteedEnd;

// Remove this as well - or else you'll get an unwanted side effect when you reload the grid that previously had a dataset smaller than pageCount
delete store.totalCount;

// Prefetch the data again and the store will reload itself correctly
store.guaranteeRange(0, store.pageSize - 1);
},

By reseting guaranteedStart & guaranteedEnd you are able to have the store reload the data that is to be rendered to the grid.

In the ExtJS source code, we are trying to enter the block of code in onGuaranteedRange:



onGuaranteedRange: function() {
var me = this,
totalCount = me.getTotalCount(),
start = me.requestStart,
end = ((totalCount - 1) < me.requestEnd) ? totalCount - 1 : me.requestEnd,
range = [],
record,
i = start;

end = Math.max(0, end);

if (start !== me.guaranteedStart && end !== me.guaranteedEnd) {
me.guaranteedStart = start;
me.guaranteedEnd = end;

for (; i <= end; i++) {
record = me.prefetchData.getByKey(i);
if (record) {
range.push(record);
}
}
me.fireEvent('guaranteedrange', range, start, end);
if (me.cb) {
me.cb.call(me.scope || me, range);
}
}

me.unmask();
},

It's working for me now - I'm curious if it is working for anyone else now. Please let me know!

[ericwaldheim]

It works. Thanks for posting.

(I have all my data prefetched and am using your code for setting/clearing filters.)

[strickjb]

Sweet :) I'm glad you found it helpful.

You may want to check this out to fix the sorting on bufferedgrids -

http://www.sencha.com/forum/showthread.php?175265-Sorting-a-BufferedGrid

[shiaart]

Hey! You call


store.guaranteeRange(0, store.pageSize - 1);
It loads the first page. What if i want to save my page position?

[strickjb]

That's outside the scope of the original post -



How does one reload a buffered grid and "start from scratch"?

My guess would be you'd need to retrieve the page number you are on, then do


store.guaranteeRange((pageNumber-1) * store.pageSize, (pageNumber * store.pageSize) - 1)

[dmpratt]

I too was looking for a way to reset grids after adding my own filters. Following the FiltersFeature example, and quite possibly this is new as of v4.2, but I was able to perform a rest doing the following:

store.data.clear();
store.loadPage(1);

Resets the grid, puts it back to page 1, and I've had no side effects like empty rows/white space randomly showing up in the grid. Hope it helps!

[anhera]

This thread helped me a lot! i was trying to make my buffered grid days ago and i didn't want to give up, i could find a solution since i'm working on ExtJS 4 and i can't change it, i have too much developed already.

Thank you so so much!!

Even though i still have this weird problem: when i do too much tests on firefox my grid ends up not showing rows since the first one. If you know anything about this i'll be glad to hear about it.