jqGrid 不刷新新数据

Question

我通过传入页码 n 从服务器获取 json 数据，该页码应获取第 n 100 行。加载一次并按下 "next page" 按钮后，它似乎正确地获取了新数据（刷新时我输出了新数据中的第一个对象）但它没有在我的网格中填充该数据。

<div>
    <button id="refreshJobsButton">Refresh Jobs</button>
    <button id="nextPageJobsButton">Next page</button>
    <table id="JobTable"><tr><td/></tr></table>
    <div id="JobPager" class="ui-widget"></div>
</div>

$(document).ready(function() {
    var page = 0;
$('#nextPageJobsButton').button({
            icons: {
                primary: "ui-icon ui-icon-arrowrefresh-1-s"
            }
    }).click(function(){
    page = page + 1;
$("#JobTable").jqGrid('GridUnload');
        refreshJob(page);
        });
};
        function refreshJob(page) {
            var $source = "ajax/refreshJob?page=" + page;

        $.ajax({
            url: $source,
            dataType: "json",
            success: populateJobs,
            error: handleAjaxError
        });
    }

        function populateJobs(jobs) {
    k = Object.keys(jobs)[0];
    l = Object.keys(jobs[k])[0];
    alert ("First job in list is " + jobs[k][l]); //Outputs correct job of that page

        $(function() {
            var grid = $('#JobTable');
            $('#JobTable').jqGrid({
                datatype: 'jsonstring',
                editurl: 'ajax/modifyJob',
                mtype: 'POST',
                loadonce: false,
                datastr: jobs,
                height: 600,
                autowidth: true,
                forceFit: true,
                gridview: true,
                viewrecords: true,
                multiselect: true,
                sortable: false,
                toppager: true,
                treeGrid: true,
                treeGridModel: 'adjacency',
                treedatatype: 'POST',
                ExpandColumn: 'Job',
                ExpandColClick: true,
                colNames: [
                    "Id (hidden)",
                    "Job Type (hidden)"
                ],
                colModel: [{
                    name: 'id',
                    index: 'id',
                    editable: true,
                    edittype: 'text',
                    key: true
                }, {
                    name: 'jobType',
                    index: 'jobType',
                    editable: true,
                    edittype: 'text'
                }],
                jsonReader: {
                    repeatitems: false,
                    root: function(obj) {
                        return obj;
                    },
                    page: function() {
                        return 1;
                    },
                    total: function() {
                        return 1;
                    },
                    records: function(obj) {
                        return obj.length;
                    }
                }
            });

谁能告诉我哪里出了问题？

Answer 1

在您的代码中搜索 $(function() {。它与 $(document).ready(function() { 相同，但您在 $(document).ready(function() { 中包含了块 $(function() { 。您应该删除 $(function() {（请参阅创建 jqGrid 的位置附近）。

jqGrid 不刷新新数据

jqGrid does not refresh with new data

jquery

jqgrid