PDA

View Full Version : Editor grid with infinite scroll



abhijit
15 Aug 2013, 12:06 AM
I have a simple editor grid which has infinite scrolling enabled on it -


Ext.Loader.setConfig({
enabled: true,
disableCaching: true,
});


Ext.onReady(function() {
Ext.tip.QuickTipManager.init();

Ext.define('Contact', {
extend : 'Ext.data.Model',

fields : [ 'id', 'name', 'company' ],

proxy : {
type : 'rest',
url : '/contacts',
reader : {
root : 'value',
type : 'json',
successProperty : 'success'
}
}
});

var store = Ext.create('Ext.data.Store', {
model : 'Contact',

buffered : true,

pageSize : 50,
leadingBufferZone : 100,

autoLoad : true,
autoSync : true

});

var cellediting = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit : 2
});

var grid = Ext.create('Ext.grid.Panel', {

title : 'Editor Grid with Infinite Scroll',

plugins : [ cellediting ],

store : store,

columns : [
{
header : 'ID',
dataIndex : 'id'
},
{
header : 'Name',
dataIndex : 'name',
editor : {
xtype : 'textfield'
}
},
{
header : 'Company',
dataIndex : 'company',
editor : {
xtype : 'textfield'
}
}
],

tbar : [
{
text : 'Add Record'
,handler : function(){
var record = new Contact({
name : 'New Contact'
});

store.insert(0, record);
}
},
'-',
{
text : 'Delete Record'
,handler : function(){
var record = grid.getSelectionModel().getLastSelected();

if (record)
store.remove(record);
}
},
'->',
{
text : 'Refresh'
,handler : function(){
store.reload();
}
}
]
});


var viewport = Ext.create('Ext.container.Viewport', {
layout : 'fit',

items : [ grid ]

});

});


If I try to add, edit or delete a record, I get the following error -


this.data.filterBy is not a function


When I disable the infinite scrolling by commenting out "buffered: true", everything seems to work fine.

How do I resolve this issue? I've looked everywhere and tried everything but just am not able to figure out how to approach this.

This code works fine with Extjs 4.1.1a but fails in Extjs 4.2.1.744 and 4.2.1.883

Any suggestions would be great, as I'm at the end of my wits about this.

Thanks in advance.

Gary Schlosberg
15 Aug 2013, 8:39 PM
Adding and removing records aren't currently supported on buffered stores. The functionality seems to have been removed after 4.1. You should still be able to use a buffered renderer if that helps.