Question

运行时数据“queryData”与样本数据“myData”完全相同，“queryData”是来自ajax的运行时数据，但表中没有填充数据。如果我在jqGrid“data：queryData”的数据元素中将“queryData”替换为“myData”，则填充表。我没有收到“queryData”的任何错误，并且没有填充表格。

function populateTable(dataToPopulate){ 
    var queryData = JSON.stringify(dataToPopulate);
    alert('--query data is:'+queryData);
    $("#searchResultsGrid").jqGrid({         
         data: queryData,
         datatype: 'local',                     
         colNames: ['Claim Number', 'Injury date', 'Last Name', 'First name', 'MI', 'SSN'],
         colModel: [{name: 'claimNumber', index: 'claimNumber', width: 110, align: 'left',sortable:true},    {name: 'doi', index: 'doi', width: 130, sortable:true},   {name: 'lastName', index: 'lastName', width: 120, sortable:true},   {name: 'firstName', index: 'firstName', width: 65, sortable:true}, {name: 'miName', index: 'miName', width: 60, align: 'center', sortable:true},{name: 'ssn', index: 'ssn', width: 95, align: 'center', sortable:true}   ],
         caption: 'Search Results',
         height: '100%',
         width: '100%',
         rownumbers: true,
         sortname : 'doi',
         sortorder : 'desc',
         viewrecords : true,
         autowidth: true,
         hidegrid: false
    });     
}
//sample local data
var myData = [  {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"null", "ssn":"123-456-7890"},{"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"X", "ssn":"123-456-7890"},   {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"X", "ssn":"123-456-7890"} ];

Answer 1

您的代码中存在一些问题。

将data: queryData更改为datastr: queryData，

将datatype: 'local'更改为datatype: "jsonstring"，

将jsonReader: { repeatitems: false },添加到您的网格选项

json字符串应该采用下面给出的格式

var myData = {
                "page": "1",
                "records": "2",
                "rows": [ 
                         {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"null", "ssn":"123-456-7890"},
                         {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"X", "ssn":"123-456-7890"},   
                         {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"X", "ssn":"123-456-7890"} ]};

下面给出了代码的工作版本

function populateTable(queryData){ 
            var queryData = JSON.stringify(queryData);
            alert('--query data is:'+queryData);
            $("#searchResultsGrid").jqGrid({         
                datastr:  queryData,
               //  pager:'#searchResultsGridPagingTool',
                 datatype: "jsonstring",               
                 colNames: ['Claim Number', 'Injury date', 'Last Name', 'First name', 'MI', 'SSN'],
                 colModel: [{name: 'claimNumber', index: 'claimNumber', width: 110, align: 'left',sortable:true},
                            {name: 'doi', index: 'doi', width: 130, sortable:true},   
                            {name: 'lastName', index: 'lastName', width: 120, sortable:true},   
                            {name: 'firstName', index: 'firstName', width: 65, sortable:true}, 
                            {name: 'miName', index: 'miName', width: 60, align: 'center', sortable:true},
                            {name: 'ssn', index: 'ssn', width: 95, align: 'center', sortable:true}   ],
                 caption: 'Search Results',
                 height: '100%',
                 width: '100%',
                 rownumbers: true,
                 jsonReader: { repeatitems: false },
                 sortname : 'doi',
                 sortorder : 'desc',
                 viewrecords : true,
                 autowidth: true,
                 hidegrid: false
            });     
        }
        //sample local data
        var myData = {
                "page": "1",
                "records": "2",
                "rows": [ 
                         {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"null", "ssn":"123-456-7890"},
                         {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"X", "ssn":"123-456-7890"},   
                         {"claimNumber":"NF873673", "doi":"12/12/2012", "lastName":"Doe", "firstName":"John", "miName":"X", "ssn":"123-456-7890"} ]};

        populateTable(myData);

jqgrid没有使用“data”元素数据显示/填充表

1 个答案: