如何通过 Azure 移动服务使用服务器端排序和分页

我正在将 jqGrid (inlineNav) 与来自 azure 服务的数据一起使用，并且有兴趣了解如何通过 Azure 移动服务使用服务器端排序和分页。

请分享对此的想法。

Windows Azure 移动服务提供 REST API，可用于获取/插入/编辑/删除您为相应访问配置的表的数据（请参阅文档 http://msdn.microsoft.com/en-us/library/windowsazure/jj591475.aspx). 查询记录操作 http://msdn.microsoft.com/en-us/library/windowsazure/jj677199.aspx请求使用 HTTP GET 动词。它支持开放数据协议 (OData) URI 选项$orderby, $skip, $top and $inlinecount可以用来填充jqGrid。

$("#list4").jqGrid({
    url : 'https://mohit.azure-mobile.net/tables/Schedules',
    datatype: "json",
    height: "auto",
    colModel: [
        { name: "RouteId", width: 50 },
        { name: "Area", width: 130 }
    ],
    cmTemplate: {editable: true, editrules: { required: true}},
    rowList: [10, 20, 30],
    rowNum: 10,
    prmNames: { search: null, nd: null },
    ajaxGridOptions: {
        contentType: "application/json",
        headers: {
            "X-ZUMO-APPLICATION": "myKey"
        }
    },
    serializeGridData: function (postData) {
        if (postData.sidx) {
            return {
                $top: postData.rows,
                $skip: (parseInt(postData.page, 10) - 1) * postData.rows,
                $orderby: postData.sidx + " " + postData.sord,
                $inlinecount: "allpages"
            };
        } else {
            return {
                $top: postData.rows,
                $skip: (parseInt(postData.page, 10) - 1) * postData.rows,
                $inlinecount: "allpages"
            };
        }
    },
    beforeProcessing: function (data, textStatus, jqXHR) {
        var rows = parseInt($(this).jqGrid("getGridParam", "rowNum"), 10);
        data.total = Math.ceil(data.count/rows);
    },
    jsonReader: {
        repeatitems: false,
        root: "results",
        records: "count"
    },
    loadError: function (jqXHR, textStatus, errorThrown) {
        alert('HTTP status code: ' + jqXHR.status + '\n' +
            'textStatus: ' + textStatus + '\n' +
            'errorThrown: ' + errorThrown);
        alert('HTTP message body (jqXHR.responseText): ' + '\n' + jqXHR.responseText);
    },
    pager: "#pager1",
    sortname: "Area",
    viewrecords: true,
    caption: "Schedule Data",
    gridview: true
});

对上面代码的一些注释：

• 我删除了sortable: false允许通过单击列标题对网格进行排序
• 尊重prmNames选项一可以删除向服务器发送不需要的参数或对其进行重命名。我用了prmNames: { search: null, nd: null }拒绝发送_search and nd选项。一个可以使用sort: "$orderby", rows: "$top"重命名另外两个参数，但是因为我们需要计算$skip并附加sord after sidx我们需要使用serializeGridData。因此本例中不需要重命名其他参数。
• using serializeGridData我们构建将发送到服务器的选项列表。
• ajaxGridOptions将用于设置 jQuery.ajax 请求的附加参数，该请求在内部执行 jqGrid 以访问服务器。我在示例集中使用的选项Content-Type: application/json and X-ZUMO-APPLICATION: myKey在 HTTP 标头中
• 服务器的响应不包含total（总页数），所以我们使用beforeProcessing根据其他信息填充属性的回调before将处理响应。
• 因为我们使用$inlinecount=allpagesURL 中的选项来自服务器的响应将包含有关记录总数的信息，并且数据页将包装在results答案的一部分。所以我们使用jsonReader: {repeatitems: false, root: "results", records: "count"}阅读回复。
• 我们必须删除loadonce: true选项，因为服务器仅返回请求的数据页而不是整个数据集。