0

我必须创建一个带有分页的网格。存储所需的 json 数据将进入 ajax 调用。在这里，我创建了 store，它加载了从 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 中（offset = start，limit = limit，您的页面将在此处为 1）：

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