ExtJS4.1の無限スクロール機能を使おうとしています。
ajax呼び出しが行われ、データが返されますが、最初のページのみが読み込まれます。
私は何が間違っているのですか?下にスクロールしても何も起こりません。
私のコード:
ストア:
Ext.define('BM.store.Tests', {
extend: 'Ext.data.Store',
model: 'BM.model.Test',
storeId: 'Tests',
buffered: true,
leadingBufferZone: 50,
pageSize: 25,
purgePageCount: 0,
autoLoad: true
});
プロキシはモデルにあります:
proxy: {
type: 'ajax',
api: {
create: '../webapp/tests/create',
read: '../webapp/tests',
update: '../webapp/tests/update'
},
reader: {
type: 'json',
root: 'tests',
successProperty: 'success'
}
}
グリッド:
Ext.define('BM.view.test.MacroList', {
extend: 'Ext.grid.Panel',
alias:'widget.macro-test-list',
store: 'Tests',
// loadMask: true,
// selModel: {
// pruneRemoved: false
// },
// viewConfig: {
// trackOver: false
// },
verticalScroller: {
numFromEdge: 5,
trailingBufferZone: 10,
leadingBufferZone: 20
},
initComponent: function() {
this.columns = [
{
xtype: 'gridcolumn',
dataIndex: 'name',
text: 'Name'
},
{
xtype: 'datecolumn',
dataIndex: 'created',
text: 'Date Created',
format: 'd-M-Y'
},
{
xtype: 'datecolumn',
dataIndex: 'changed',
text: 'Last Updated',
format: 'd-M-Y'
}
];
this.callParent(arguments);
}
私の実装と例の実装との唯一の違いは、グリッドがボディにレンダリングされていないことです。
ビューポートには境界線レイアウトが含まれています。
グリッドは西部地域パネルの一部です。
{
collapsible: true,
region: 'west',
xtype: 'macro',
width: 500
}
マクロパネル:
Ext.define('BM.view.Macro', {
extend: 'Ext.panel.Panel',
alias: 'widget.macro',
title: 'Tests',
layout: {
type: 'vbox',
align: 'stretch'
},
items: [
{
id: "macro-test-list-id",
xtype: 'macro-test-list',
flex: 1
},
{
id: "macro-report-panel-id",
xtype: 'macro-report-list',
title: false,
flex: 1
},
{
id: "macro-report-list-id-all",
xtype: 'macro-report-list-all',
flex: 1,
hidden: true,
layout: 'anchor'
}
]
});
レイアウトの変更、グリッドの高さの固定など、さまざまなことを試しました。
何も機能せず、下にスクロールすると、グリッドが更新されません。
もう1つの情報:DBには53レコードのデータが含まれています。3つのajax呼び出しを受信していますが、最初の25レコードのみが表示されます(要求どおり)。
何かご意見は?