jqGrid 显示列，检索数据但不显示数据

Question

我对 jqGrid 有一个新问题。我对 slickgrid 也有同样的问题。现在我的错误。

我有 2 个测试网格。其中一个网格将显示数据，但在第二个中它不显示数据。

我认为两者的程序相同。

这是我的测试网格 1 代码：

var jqGrid = {
    columns: {
        model: [
            { name: 'displayName', id: "displayName" },
            { name: 'documentTitle', id: "documentTitle" },
            { name: 'isConfirmed', id: "isConfirmed" },
            { name: 'requestDate', id: "requestDate" },
            { name: 'version', id: "version" }
        ],
        names: [
            'Dokument-Titel',
            'Benutzername',
            'Status',
            'Datum der Erinnerung',
            'Version'
        ]
    },
    dataSource: 'Service.asmx/GetGridData'
}
var myData = [
    {   displayName: "Test, Test", documentTitle: "Test", isConfirmed: "Ausstehend", requestDate: "2014-11-26", version: "1.0" },
    { displayName: "Test2, Test2", documentTitle: "Test",  isConfirmed: "Ausstehend", requestDate: "2014-11-26", version: "1.0" }
];
window.data = myData;
jQuery("#grid-table").jqGrid({
    autowidth: true,
    data: myData,
    colNames: jqGrid.columns.names,
    colModel: jqGrid.columns.model,
    dataType: 'json',
    pager: '#pager',
    height: 600,
    grouping: true,
    groupingView: {`enter code here`
        groupingField: ['DocumentTitle'],
        groupColumnShow: [false]
    },



    viewrecords: true

});

这是来自 testgrid 2 的代码：

function test() {
    var mydata = [
        { id: "1", name: "test", note: "note", total: "2111.00" , tax: "10.00"},
        { id: "2", name: "test2", note: "note2", tax: "20.00", total: "320.00" },
        { id: "3", name: "test3", note: "note3", tax: "30.00", total: "430.00" },
        { id: "4", name: "test", note: "note", tax: "10.00", total: "210.00" },
        { id: "5", name: "test2", note: "note2", tax: "20.00", total: "320.00" },
        { id: "6", name: "test3", note: "note3", tax: "30.00", total: "430.00" },
        { id: "7", name: "test", note: "note", tax: "10.00", total: "210.00" },
        { id: "8", name: "test2", note: "note2", amount: "300.00", tax: "21.00", total: "320.00" },
        { id: "9", name: "test3", note: "note3", amount: "400.00", tax: "30.00", total: "430.00" },
        { id: "11", name: "test", note: "note", amount: "200.00", tax: "10.00", total: "210.00" },
        { id: "12", name: "test2", note: "note2", amount: "300.00", tax: "20.00", total: "320.00" },
        { id: "13", name: "test3", note: "note3", amount: "400.00", tax: "30.00", total: "430.00" },
        { id: "14", name: "test", note: "note", amount: "200.00", tax: "10.00", total: "210.00" },
        { id: "15", name: "test2", note: "note2", amount: "300.00", tax: "20.00", total: "320.00" },
        { id: "16", name: "test3", note: "note3", amount: "400.00", tax: "30.00", total: "430.00" },
        { id: "17", name: "test", note: "note", amount: "200.00", tax: "10.00", total: "210.00" },
        { id: "18", name: "test2", note: "note2", amount: "300.00", tax: "20.00", total: "320.00" },
        { id: "19", name: "test3", note: "note3", amount: "400.00", tax: "30.00", total: "430.00" },
        { id: "21", name: "test", note: "note", amount: "200.00", tax: "10.00", total: "210.00" },
        { id: "22", name: "test2", note: "note2", amount: "300.00", tax: "20.00", total: "320.00" },
        { id: "23", name: "test3", note: "note3", amount: "400.00", tax: "30.00", total: "430.00" },
        { id: "24", name: "test", note: "note", amount: "200.00", tax: "10.00", total: "210.00" },
        { id: "25", name: "test2", note: "note2", amount: "300.00", tax: "20.00", total: "320.00" },
        { id: "26", name: "test3", note: "note3", amount: "400.00", tax: "30.00", total: "430.00" },


          { id: "27", name: "test", note: "note", amount: "200.00", tax: "10.00", total: "210.00" },
            { id: "28", name: "test2", note: "note2", amount: "300.00", tax: "20.00", total: "320.00" },
            { id: "29", name: "test3", note: "note3", amount: "400.00", tax: "30.00", total: "430.00" }
        ];
        window.myData = mydata;
        jQuery("#grid-table").jqGrid({
            data: mydata,
            datatype: "local",
            height: 'auto',
            rowNum: 30,
            rowList: [10, 20],
            colNames: ['Inv No',  'Name', 'Amount', 'Tax', 'Total', 'Notes'],
            colModel: [
                { name: 'id'},
                { name: 'name' },
                { name: 'amount'},
                { name: 'tax' },
                { name: 'total' },
                { name: 'note' }
            ],
           pager: "#pager",
            viewrecords: true,
            sortname: 'name',
            grouping: true,
            groupingView: {
                groupField: ['id'],
                groupColumnShow: [false]
            },
            caption: "Hide Grouping Column"

        });
    }

确实有几个选项与顶部不同，但为什么我没有得到表格数据？

Answer 1

第一个网格使用dataType: 'json' 而不是datatype: 'json'，并且没有指定任何url 选项。您应该添加类似url: jqGrid.dataSource 的内容。我想你的两个网格不在同一个页面上，因为你在同一个寻呼机中使用：pager: "#pager"。网格不能共享同一个寻呼机。