Question

我已经搜索过这个问题的高低......我发现很多人都有同样的问题，但没有一个有明确的解决方案...... 基本上我在extjs上有一个网格......它从sqldb获取数据。它使用json加载很好。 “但是”......当试图实现分页时，这就是它变得混乱的地方......

pagesize设置为5 ...这意味着第一页应该只显示5条记录，但我的网格显示整条记录
即使存在“下一个”按钮，它在技术上也不起作用，因为整个记录已经存在于第一页上
我设置了page.loadPage（2）...并且消息显示“显示第二页”，但它实际上显示了整个记录
“Page _ of 6”中的页码始终为空白。见下图...

以下是我的商店......

       var store = Ext.create('Ext.data.Store', {
        storeId: 'myData',
        pageSize: 5,
        autoLoad: true,
        method: "POST",
        remoteSort: true,
        fields: [
    { name: 'Q1', type: 'int' },
    { name: 'Q2', type: 'int' },
    { name: 'Q3', type: 'int' },
    { name: 'Q4', type: 'int' },
    { name: 'Q5', type: 'int' },
    { name: 'Improvements', type: 'string' },
    { name: 'Comments', type: 'string' }
    ],

        sorters: [
        {
            property: 'Q1',
            direct: 'ASC'
        }
     ],

        proxy: {
            type: 'ajax',
            url: 'GridView/writeRecord',
            reader: {
                type: 'json',
                totalProperty: "count",
                root: "myTable"
            }
        },
        autoLoad: { params: { start: 0, limit: 5} }   

    });

    this.grid = Ext.create('Ext.grid.Panel', {
        title: ' ',
        trackMouseOver: true,
        disableSelection: true,
        autoHeight: true,
        store: store,
        loadMask: true,
        height: 500,
        width: 800,
        renderTo: Ext.getBody(),
        columns: [

        { header: 'Q1',
            sortable: true, dataIndex: 'Q1'
        },
        { header: 'Q2',
            sortable: true, dataIndex: 'Q2'
        },
        { header: 'Q3',
            sortable: true, dataIndex: 'Q3'
        },
        { header: 'Q4',
            sortable: true, dataIndex: 'Q4'
        },
        { header: 'Improvements', flex: 1,
            sortable: true, dataIndex: 'Improvements'
        },
        { header: 'Comments', flex: 1,
            sortable: true, dataIndex: 'Comments'
        }
    ],
        bbar: Ext.create('Ext.PagingToolbar', {
            store: store,
            displayInfo: true,
            preprendButtons: true,
            displayMsg: 'Displaying Surveys {0} - {1} of {2}',
            emptyMsg: "No Surveys to display"

        })
    });

这是我的JSON ......它实际上有30条记录，但我把它修剪下来......

  {
  "count": 30,
  "myTable": [
  {
  "Q1": "1",
  "Q2": "1",
  "Q3": "1",
  "Q4": "1",
  "Improvements": "",
  "Comments": "1"
},
{
  "Q1": "3",
  "Q2": "2",
  "Q3": "2",
  "Q4": "2",
  "Improvements": "This is A very long comment. What do you think?",
  "Comments": "Agreed"
},
{
  "Q1": "4",
  "Q2": "2",
  "Q3": "4",
  "Q4": "3",
  "Improvements": "Hello2",
  "Comments": "Hello2"
},
{
  "Q1": "3",
  "Q2": "2",
  "Q3": "2",
  "Q4": "1",
  "Improvements": "Hello4",
  "Comments": "Hello4"
}

] }

此外，如果这有助于我获得我的Json

        string sqlquery = "SELECT Q1, Q2, Q3, Q4, Improvements, Comments FROM ITable";
        conn.Open();
        SqlDataAdapter cmd = new SqlDataAdapter(sqlquery, conn);
        SqlCommand comd = new SqlCommand(sqlquery, conn);
        DataSet myData = new DataSet();
        cmd.Fill(myData, "myTable");

        comd.CommandText = "SELECT COUNT(*) FROM ITable";
        Int32 count = (Int32)comd.ExecuteScalar();

        comd.ExecuteNonQuery();
        conn.Close();


        var results = (new

        {

            TotalNumber = count,

            myTable = myData

        });

        return JsonConvert.SerializeObject(new { count=count, myTable = myData.Tables[0] }, Formatting.Indented,
                        new JsonSerializerSettings
                        {
                            ReferenceLoopHandling = ReferenceLoopHandling.Ignore
                        });

我知道我的Json是对的...它读取了30条记录，因为它是“显示_的30”...我不知道我做错了什么...它不能是浏览器问题..为什么它会在一页中全部丢失？任何人

Answer 1

使用分页工具栏时，服务器应该为您分页数据。您不能一次提供所有记录。

分页工具栏将发送请求每个页面的请求，服务器应该只返回该页面的记录。

如果您想要在内存数据中进行分页（一次性获取所有数据，您必须实现自己的，或使用其中一个扩展名。

请参阅http://docs.sencha.com/ext-js/4-1/#!/api/Ext.toolbar.Paging

上标题为“使用本地数据进行分页”的部分

因此，要按预期使用它，您必须更改服务器代码以考虑start和limit HTTP参数

Grid中的Extjs Paging工具栏不起作用

1 个答案: