如何通过ajax将数据绑定到onSortCol中的jqgrid

Question

您好我需要绑定jqgrid的数据，该数据将从onSortCol / onPaging函数中的服务器返回。我的要求是在jqgrid中实现批处理/分页。

如果返回的数据包含超过1500条记录，那么我需要绑定前1000条记录，然后下一批中的下500条记录（类似于谷歌搜索结果）以提高性能。如果用户在第1000条记录之后单击下一页，我需要从服务器获取下一条500条记录并将其绑定到网格。我的行数与每页[10,20,30,40,50]条记录一样。因此，应根据这些总计（1500）记录更新分页和总记录数。

如果用户点击任何列的排序，那么我需要获取最后的记录并将其绑定到网格。我能够通过ajax从服务器获取排序数据（最后500条记录），但无法绑定onSortCol函数中的数据。任何人都可以告诉我如何实现这一目标吗？我的工作代码是`

    $(function () {
        //Hidden fields values which are returned from code behind
        var colM = JSON.parse(document.getElementById("GridModel").value);
        var colN = JSON.parse(document.getElementById("GridColumnNames").value); 
        var obj = JSON.parse(document.getElementById("GridResult").value);
        var colData = obj.RECORD;
        //debugger;

        //Values which are assigned in the code behind
        var totalRecords=<%=lTotalRecords%>;
        var recordsperpage=<%=lRecPerPage%>;
        var batchstart=<%=lBatchStart%>;
        var batchend=<%=lBatchEnd%>;
        var sortName= GetSortName("<%=sSortOn%>",colN,colM);
        var sortDirection= GetSortDirection("<%=sOrderBy%>");
        var pageCount=Math.round((totalRecords+recordsperpage-1)/recordsperpage);

        var myGriddata = {
            "rows": obj.RECORD
        };

        debugger;
        $("#jqGrid").jqGrid({
            datatype: "jsonstring",
            datastr: myGriddata,
            colNames: colN,
            colModel: getColModels(colData[0], colN, colM),
            jsonReader: { 
                repeatitems: false,
                total : totalRecords,
                records : recordsperpage },
            rowNum: recordsperpage,
            rowList: [10, 20, 30, 40, 50],
            loadtext: "Loading",
            //loadonce: true,
            pager: "#jqGridPager",
            sortname: sortName, 
            sortorder: sortDirection, 
            autowidth: true,
            height: 300,
            shrinkToFit: false,
            forceFit: true,
            onSortCol: function (index, columnIndex, sortOrder) {
                $.ajax({
                    type: "POST",
                    url: "SearchResult.aspx/OnPagingSorting",
                    data: "{'SortOnColumn':'"+index+"','SortOrderBy':'"+sortOrder+"','BatchStart':'','BatchEnd':''}",
                    dataType: "json",
                    contentType: "application/json; charset=utf-8",
                    success: function (jsondata,status) {
                        //alert("Success");
                        if(status=="success") {
                            var myData=JSON.parse(jsondata.d);
                            myGriddata = {
                                "records": recordsperpage,
                                "total":totalRecords,
                                "rows": myData.RECORD,
                                "recordtext": "View {0} - {1} of  "+totalRecords,
                                "pgtext": "Page {0} of "+pageCount
                            };

                            $('#jqGrid').
                                jqGrid('setGridParam', 
                                {
                                    datatype: "jsonstring",
                                    datastr: myGriddata
                                });
                            //.trigger('reloadGrid');
                            //jQuery('#jqGrid').trigger('reloadGrid');
                        }
                    },
                    error: function (x, e) {
                        alert(x.readyState + " "+ x.status +" "+ x.responseText);  
                        return "stop";
                    }
                });
            },
            viewrecords: true,
            caption: "JQ Grid Documents"
        });
        jQuery("#jqGrid").jqGrid('navGrid', '#jqGridPager', {
            edit: false,
            add: false,
            del: false,
            search: false,
            refresh:false
        }).navButtonAdd('#jqGridPager', {
            caption: "Export to Excel",
            title: "Export to Excel",
            buttonicon: "ui-icon-disk",
            onClickButton: function () {

            }
        }).navButtonAdd('#jqGridPager', {
            caption: "Back",
            title: "Back",
            buttonicon: "ui-icon-disk",
            onClickButton: function () {

            },
            position: "last"});
    });


    function GetSortDirection(sortDirection)
    {
        var sorting="";
        switch (sortDirection){
            case "D":
                sorting="desc";
                break;
            case "A":
                sorting="asc";
                break;
            default:
                sorting="desc";
                break;
        }
        return sorting;
    }

    function GetSortName(sortName,colNames,colModel){
        var sortcol="";
        switch (sortName){
            case "MODIFY_DATE":
                sortcol="MODIFIED_DATE";
                break;

            default:
                sortcol=sortName;
                break;
        }
        return sortcol;
    }

    function getColModels(data, colNames, colModel) {
        var colModelsArray = [];
        for (var i = 0; i < colNames.length; i++) {
            var str;
                str = {
                    name: colModel[i],
                    index: colModel[i]
                };
            colModelsArray.push(str);
        }
        return colModelsArray;
    }

</script>`