PDA

View Full Version : BufferedRenderer not buffering when Store.pageSize set



DevSparcle
6 Jun 2013, 3:55 PM
Hi,

I've seen the last getCount() vs getTotalCount() problems on BufferedRenderer, but now if I set the Store's pageSize to 30, and configuring properly the BufferedRenderer, my grid always show 30 rows and nothing happens if I scroll down.

I think the BufferedRenderer + Store.pageSize is a very powerful alternative to drop the user-hated pagers from all of our grids, but now this is impossible if I don't want to load a full recordset with 1000-2000 counts of records which is very expansive both on server and client side.

I think that BufferedRenderer needs to check if pageSize set, then use getTotalCount(), other use getCount(). This may be going to another issue with filters again, but I don't sure about this.

Using ExtJS 4.2.1 with Architect

slemmon
10 Jun 2013, 10:48 AM
Can you open the Infinite Scroll Grid Tuner from the grid examples in the downloaded SDK and modify the settings in the tuner to demonstrate the issue you're seeing? If so, can you report back what settings you've set in the Tuner example that show the issue?

DevSparcle
13 Jun 2013, 9:14 AM
Thank you for your response. I'll do it a.s.a.p. as you suggested, and then reporting back.

DevSparcle
14 Jun 2013, 1:23 PM
I'm using the online library configured by Architect by default so I navigated to http://docs.sencha.com/extjs/4.2.1/extjs-build/examples/grid/infinite-scroll-grid-tuner.html then tried the tuner. It works fine, so I really don't know what's going wrong at my side.


Ext.define('MyApp.store.EmployeeListStore', { extend: 'Ext.data.Store',


requires: [
'MyApp.model.EmployeeListModel'
],


constructor: function(cfg) {
var me = this;
cfg = cfg || {};
me.callParent([Ext.apply({
autoLoad: false,
model: 'MyApp.model.EmployeeListModel',
storeId: 'EmployeeListStore',
pageSize: 30,
proxy: {
type: 'ajax',
url: '/env.php/munkavallalok/grid/',
reader: {
type: 'json',
root: 'rows',
totalProperty: 'results'
}
}
}, cfg)]);
}
});


{ xtype: 'gridpanel',
flex: 1,
title: 'Employees',
forceFit: false,
store: 'EmployeeListStore',
columns: [
{
xtype: 'templatecolumn',
tpl: [
'<tpl if="type==\'S\'"><img src="/ui/images/icons/black/16x16/row%208/9.png" title="Short list"></tpl>',
'<tpl if="type==\'N\'"><img src="/ui/images/icons/black/16x16/row%204/13.png" title="Rejected"></tpl>',
'<tpl if="bejelentve==\'B\'"><img src="/ui/images/icons/black/16x16/row%2010/9.png" title="Accepted"></tpl>'
],
width: 60,
resizable: false,
defaultWidth: 60,
text: 'Within lists'
},
{
xtype: 'gridcolumn',
width: 170,
resizable: false,
defaultWidth: 170,
dataIndex: 'person_name',
text: 'Name'
},
{
xtype: 'gridcolumn',
hidden: true,
width: 170,
defaultWidth: 170,
dataIndex: 'birth_name',
text: 'Birth name'
},
{
xtype: 'gridcolumn',
width: 150,
defaultWidth: 150,
dataIndex: 'place_of_birth',
text: 'Place of birth'
},
{
xtype: 'datecolumn',
width: 130,
defaultWidth: 130,
dataIndex: 'date_of_birth',
text: 'Date of birth,
format: 'Y-m-d'
},
{
xtype: 'templatecolumn',
tpl: [
'<a href="mailto:{email}">{email}</a>'
],
width: 180,
defaultWidth: 180,
dataIndex: 'email',
text: 'E-mail'
},
{
xtype: 'gridcolumn',
dataIndex: 'phone',
text: 'Phone'
},
{
xtype: 'gridcolumn',
width: 250,
defaultWidth: 250,
dataIndex: 'address',
text: 'Address'
}
],
selModel: Ext.create('Ext.selection.CheckboxModel', {


}),
plugins: [
Ext.create('Ext.grid.plugin.BufferedRenderer', {
leadingBufferZone: 100,
numFromEdge: 10,
trailingBufferZone: 25
})
]
}

Code is generated so-fully by Architect based on my settings.

Data loaded from server PHP is:

{
"results": 201,
"rows": [
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... },
{"id":... }
]
}

Any tip?

Thank you!

Datamex
16 Dec 2014, 8:25 AM
How did you solve this problem? My config looks exactly the same as yours and only one call is being made to the server while the grid is not fully filled and there are many more records on te server.