5

この例のように、アプリ (ExtJs 4.2.1) に無限スクロール グリッド パネルがあります。ユーザーが更新ボタンをクリックすると、DB からのデータでグリッドの行を更新する必要があります。更新ボタン ハンドラーで store.load() を呼び出すと、データが更新されます。これは、グリッド パネルの最初の行 (ページ 1 のレコード) でうまく機能します。ただし、ユーザーがグリッドを下にスクロールした場合は機能しません。store.load の後、グリッドはスクロール位置を一番上にリセットします。

ストアをリロードし、現在の選択と現在のスクロール位置を保持するグリッドを更新するソリューションを求めています。良い点: ストア内の各レコードのグローバル インデックスがあります。

これが私のコードです。DBには何千ものエントリがあります。

グリッド パネル:

Ext.define('MyApp.view.MyGrid', {
    extend: 'Ext.grid.Panel',
    requires:[ 'Ext.grid.plugin.BufferedRenderer'],
    alias: 'widget.myGrid',
    plugins: 'bufferedrenderer',
    loadMask: true,
    selModel: {
        mode: 'MULTI',
        pruneRemoved: false
    },
    itemSelector: 'div.workspaceItemSelector',
    overItemCls: 'workspaceItemMouseOver',
    trackOver: true,
    autoScroll: true,
    verticalScroller: { variableRowHeight: true },
    defaultSortOrder: 'ASC',

    // and some column definitions ...
});

店：

Ext.define('MyApp.store.MyStore', {
    extend: 'Ext.data.Store',
    autoLoad: false,
    buffered: true,
    pageSize: 100,
    leadingBufferZone: 100,
    remoteSort: true,
    model: 'MyApp.model.MyModel',
    storeId: 'myStore',
    proxy:  {
        type: 'rest',
        url: 'someUrl',
        reader: { type: 'json', totalProperty: 'total', root: 'items' }
    }
});

バッファリングされていないグリッドの解決策がありますが、私にはうまくいきません。

4

2 に答える 2