jqGrid не загружает данные

Question

Я использую jqGrid для решения таблицы данных. Ниже приведены коды конфигурации.

$(function() {
    $("#submitInput").click(function() {
        alert("I am called...")
        jQuery("#list").jqGrid({
            datatype: "json",
            url: "http://localhost:1201/admin/someURL.htm",
            mtype:"POST",
            height: "auto",
            colNames:["Column 1", "Column 2", "Column 3", "Column 4", "Column 5"],
            colModel:[
                {name:"col1", index:"col1", sortable:true, resizable:false},
                {name:"col2", index:"col2", sortable:true},
                {name:"col3", index:"col3", sortable:false, resizable:false},
                {name:"col4", index:"col4", sortable:true, resizable:false},
                {name:"col5", index:"col5", sortable:true, resizable:false}
            ],
            sortname:'col1',
            sortorder:'asc',
            pager: $('#pager'),
            rowNum:10,
            viewrecords: true,
            rowList:[10,20,30],
            caption: 'Some Grid Values',
            jsonReader: {
                root: "responseData",
                page: "currentPage",
                total: "totalPages",
                records: "totalFetchedRecords",
                repeatitems: true,
                cell: "rowContent",
                id: "rowID"
            },
            gridComplete: function() {
                alert("Loading done...");
            }
        });
    });
});

Мои данные JSON поступают в следующем формате:

"currentPage":"1","responseData":[
    {"rowContent":["Col1_Val_000001","Col2_Val_1","Col3_Val_1","Col4_Val_1","Col5_Val_1"],"rowID":"Col1_Val_000001"},
    {"rowContent":["Col1_Val_000002","Col2_Val_2","Col3_Val_2","Col4_Val_2","Col5_Val_2"],"rowID":"Col1_Val_000002"}
], "totalFetchedRecords":"50","totalPages":"5"}

В моем HTML есть кнопка с идентификатором "submitInput" и таблица с идентификатором "list".

Почему-то эти данные не загружаются в сетку. В чем причина?

Answer 1

Возможно, вам не следует создавать jqGrid внутри click handle. Вы должны сделать это один раз за пределами click handle и вызвать jQuery("list").trigger('reloadGrid') внутри обработчика. Если в начале данные не должны загружаться в сетку, вы можете использовать datatype: 'local' в начале. При необходимости вы можете сделать div с jqGrid, иногда доступным, а иногда и невидимым, используя функции hide() и show() jQuery. Внутри обработчика click вы можете изменить datatype на 'json' относительно setGridParam() и затем вызвать trigger('reloadGrid'). В большинстве случаев вы также изменяете некоторые параметры URL перед вызовом trigger('reloadGrid') (см. Следует ли заменить использование addJSONData из jqGrid на использование setGridParam () и триггер ('reloadGrid')? ) , но, вероятно, вам это нужно не в вашем случае.