0

ページネーションでグリッドを作成する必要があります。ストアに必要な json データは ajax 呼び出しで取得されます。ここでストアを作成し、ajax 呼び出しから返されたデータをロードします。しかし、すべてのデータを表示するグリッドが返されました。各ページで 5 つに制限する必要があります。

私は次のコードを試しました、

      var store= new Ext.data.JsonStore({
        autoLoad    : {params: {start: 0, limit: 5}},
        totalProperty   : recordCount,
        sortInfo    : { field: "POS", direction: "ASC" },
        idProperty  : 'POS',
        data        : {},
        fields      : [
                        {'name' : 'POS'},
                        {'name' : 'NUM'}, 
                        {'name' : 'TIT'},
                        {'name' : 'MEN'},
                        {'name' : 'EIH'},
                        {'name' : 'WAE'},
                        {'name' : 'PRI'},
                        {'name' : 'LIF'}], 

    });

    var adrConn = $.getJSON('ajax.cfm', $.extend(test, {
        }), function(r) {   
            activeData = r.DATA;
            store.loadData(activeData);
            }
    );

    var grid = new Ext.grid.GridPanel({
          title         : '» test',
          applyTo       : 'panel',
          width         : 1000,
          loadMask      : false,
          autoHeight    : true,
          viewConfig    : {
                emptyText   : 'No data to display'
          },             
          tbar          : mainGridToolbar,
          bbar          : new Ext.PagingToolbar({
                  store         : store,
                  displayInfo   : true  
          }),
          store         : store,
          columns: [
                {header: "1", width : 50, dataIndex: 'POS', sortable: true},
                {header: "2", dataIndex: 'NUM', sortable: true},
                {header: "3", dataIndex: 'TIT', sortable: true},
                {header: "4", dataIndex: 'MEN', sortable: true},
                {header: "5", dataIndex: 'EIH', sortable: true},
                {header: "6", dataIndex: 'WAE', sortable: true},
                {header: "7", dataIndex: 'PRI', sortable: true},
                {header: "8", dataIndex: 'LIF', sortable: true}
          ]
      });

どんな助けでも大歓迎です...ありがとう

4

2 に答える 2

1

PagingToolbar を使用すると、グリッド サイズを 5 に制限できます。そのツールバーでは、次のようにグリッドを宣言できます。

 pageSize: 5,

PagingToolbar の例はこちら!

これがお役に立てば幸いです.....

于 2012-12-17T14:06:39.673 に答える
0

バックエンドでもページネーションを処理する必要があります。それがおそらくあなたがすべての記録を手に入れる理由です。ExtJSはパラメータをバックエンドに送信するだけで、正しいレコードが返されることを期待しています。

MySQLでは（オフセット=開始、制限=制限、ここではページは1になります）：

SELECT column FROM table
OFFSET 0 LIMIT 5
于 2012-08-10T07:19:53.800 に答える