この例ExtJS infinite grid
のようなアプリケーションを作成しました。
私のアプリケーションはデータベースからデータを受け取ります。
少量の行(100000まで)で完全に機能しました。
しかし現在、データベースには 100 万行が含まれています。そして、私は奇妙な効果を観察しました: データが完全にロードされていません. グリッドが異なる数の行を表示するたびに (最大 859176)。しかし、データベースからすべての行をロードする必要があります。
この問題を解決する方法を知っている人はいますか?
私のコード:
Ext.require ([
'Ext.grid.*',
'Ext.data.*',
'Ext.util.*',
'Ext.grid.plugin.BufferedRenderer'
]);
Ext.onReady(function () {
Ext.define('DoctorsList', {
extend: 'Ext.data.Model',
fields: [
'id', 'fio', 'specialization', 'photo'
],
idProperty: 'id'
});
var store = Ext.create('Ext.data.Store', {
id: 'store',
model: 'DoctorsList',
buffered: true,
pageSize: 100,
proxy: {
type: 'ajax',
url: 'get_doctors.jsp',
reader: {
root: 'data',
totalProperty: 'total'
}
},
autoLoad: true
});
Ext.create('Ext.grid.Panel', {
height: 600,
title: 'Doctor\'s list',
collapsible: true,
store: store,
columns: [
{
text: 'ID',
dataIndex: 'id',
width: 50,
sortable: true
},
{
text: 'Full name',
dataIndex: 'fio',
width: 300,
sortable: true
},
{
text: 'Specialization',
dataIndex: 'specialization',
width: 150,
sortable: true
},
{
text: 'Photo',
dataIndex: 'photo',
width: 100,
sortable: false,
renderer: function(value) {
return '<img width="100" src="images/' + value + '" />';
}
}
],
renderTo: 'doctors-list'
});
});
添加:
ここで、get_doctors.jsp に対する最後の要求と応答を確認できます。「total」フィールドの番号は 1005000 ですが、最後の行の ID は 423165です。これは、MS SQL データベースの選択画面です。使用されたテーブルには合計 1005000 行あることがわかります。
追記 2: このバグは Firefox と IE8 で発生しますが、Opera、Google Chrome、Safari では発生しません。
ありがとう!