Question

以下代码使用jqxgrid插件。我将循环值更改为400，生成400页，每页10页。

运行时我只看到0-26个链接（270页），而不是0-39个链接。我该如何解决这个问题呢？

我的另一个场景是，在我的应用程序中，我只看到380页的分页链接而不是900页。如果有人可以修复，以下我可以在我的应用程序中应用相同的解决方案。非常感谢！

早期代码已被修改，以使用以下示例：

http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/virtualdata.htm?classic

为什么不显示记录？请解释。需要什么改变。非常感谢。

<!DOCTYPE html>
<html lang="en">
<head>
    <title id='Description'>In this demo jqxGrid uses a virtualized paging which enables you to handle very large data sets without any impact on client side performance.</title>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> 
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxlistbox.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdropdownlist.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.pager.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> 
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var theme = getTheme();
            // prepare the data
            var data = new Array();
            var jsonObject = { "contactList":[

{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},
{"age":1,"SId":"S1234567","gender":"male"},

], "totalrecords":9};

//alert("jsonObject.totalrecords : " + jsonObject.totalrecords);

            // generate sample data.
            var generatedata = function (startindex, endindex) {
                var data = {};
                for (var i = startindex; i < endindex; i++) {

            //alert(startindex + " " + endindex);
                    var row = {};

                            row["age"] = jsonObject.contactList[i].age;
                            row["gender"] = jsonObject.contactList[i].gender;
                            row["SId"] = jsonObject.contactList[i].SId;


                    data[i] = row;
                }
                return data;
            }
            var source =
            {
                datatype: "array",
                localdata: {},
                totalrecords: jsonObject.totalrecords
            };

            // load virtual data.
            var rendergridrows = function (params) {

        alert("rendergridrows : " + source.totalrecords);
        //alert("rendergridrows : " + params.startindex + " " + params.endindex);
                var data = generatedata(params.startindex, params.endindex);
                return data;
            }
            var totalcolumnrenderer = function (row, column, cellvalue) {
                var cellvalue = $.jqx.dataFormat.formatnumber(cellvalue, 'c2');
                return '<span style="margin: 6px 3px; font-size: 12px; float: right; font-weight: bold;">' + cellvalue + '</span>';
            }
            var dataAdapter = new $.jqx.dataAdapter(source);
            $("#jqxgrid").jqxGrid(
            {
                width: 670,
                autoheight: true,
                source: dataAdapter,
                theme: theme,
                virtualmode: true,
                pageable: true,
                rendergridrows: rendergridrows,
                columns: [

                          { text: 'Age', datafield: 'age', width: 50 },
                          { text: 'SId', datafield: 'SId', width: 120 },
                          { text: 'Gender', datafield: 'gender', width: 80 },

                ]
            });
        });
    </script>
</head>
<body class='default'>
    <div id='jqxWidget' style="font-size: 13px; font-family: Verdana; float: left;">
        <div id="jqxgrid"></div>
    </div>
</body>
</html>

Answer 1

据我所知，您可以为每个页面添加锚点。我不认为DIV标签中有足够的空间用于这么多标签。考虑使用不同的布局（如输入字段）来选择页面，如此样本中包含100万条记录：virtualdata.htm

分页不会超过270页

1 个答案: