extjs - 列に並べ替えを適用すると、ExtJS 4 無限グリッドが「読み込み中...」でハングする

Question

デフォルトでうまく機能する無限グリッドがあり、結果からページをうまくフェッチします。

ただし、列ヘッダーをクリックして列の 1 つで並べ替え順序を定義すると、並べ替え前とまったく同じデータを送り返しているにもかかわらず、グリッドが「読み込み中」メッセージでハングします (私は現時点では、目的をテストするためだけに、サーバー側の「ソート」変数を無視します。)

これはオープン ソース プロジェクトのためのものであるため、支援が必要な追加ソースを利用できるようにすることができます。

どんな助けでも大歓迎です。前もって感謝します。

よろしく、ジョン。

サーバーで次のリクエストを受け取ります。

"GET /lextjsapi/reader/tblname?_dc=1361204535173&page=1&start=0&limit=10&sort=%5B%7B%22property%22%3A%22id%22%2C%22direction%22%3A%22DESC%22%7D%5D HTTP/1.1" 200 832 "http://lextjs/sa-test/app.html"

これは PHP サーバー側のコードです。

echo json_encode(array('success' => true, 'total' => 1000, $model_name => $tblNameRows));

これはストアのコードです。

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

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

constructor: function(cfg) {
    var me = this;
    cfg = cfg || {};
    me.callParent([Ext.apply({
        autoLoad: true,
        remoteSort: true,
        storeId: 'tblnameStore',
        model: 'MyApp.model.tblname',
        buffered: true,
        leadingBufferZone: 10,
        pageSize: 10,
        purgePageCount: 0,
        trailingBufferZone: 10,
        proxy: {
            type: 'ajax',
            url: 'http://lextjs/lextjsapi/reader/tblname',
            reader: {
                type: 'json',
                root: 'tblname'
            }
        }
    }, cfg)]);
} });

これはグリッドのコードです:

Ext.define('MyApp.view.MyGridPanel2', {
extend: 'Ext.grid.Panel',

height: 250,
width: 450,
title: 'My Grid Panel',
store: 'tblnameStore',

initComponent: function() {
    var me = this;

    Ext.applyIf(me, {
        viewConfig: {

        },
        columns: [
            {
                xtype: 'gridcolumn',
                dataIndex: 'id',
                text: 'Id'
            },
            {
                xtype: 'gridcolumn',
                sortable: false,
                dataIndex: 'name',
                text: 'Name'
            },
            {
                xtype: 'gridcolumn',
                sortable: false,
                dataIndex: 'address1',
                text: 'Address1'
            },
            {
                xtype: 'gridcolumn',
                sortable: false,
                dataIndex: 'city',
                text: 'City'
            }
        ]
    });

    me.callParent(arguments);
} });