jqGrid JSON映射错误

时间:2012-03-23 19:17:22

标签: jquery json jqgrid

使用jqGrid和JSON服务器响应时,我似乎遇到了使JSON映射正确的问题。

例如,我的服务器响应如下所示:

[
     {ID: 'cmp1', Name: 'Name1', Address: 'Address1', Phone: 'Phone1', Agent: 'Agent1', last_trx: 'last_trx1'}, 
     {ID: 'cmp2', Name: 'Name2', Address: 'Address2', Phone: 'Phone2', Agent: 'Agent2', last_trx: 'last_trx2'}
]

我的jqGrid设置如下所示(用于测试的本地数据类型和本地数据集):

    var grid = $('#grid_id');
    grid.jqGrid({
        datatype: 'local',
        colNames: ['ID', 'Company Name', 'Location', 'Phone', 'Agent', 'Last Load'], 
        colModel: [
            {name: 'ID', index: 'ID', jsonmap: 'ID', width: 75}, 
            {name: 'Company Name', index: 'Name', jsonmap: 'Name', width: 150}, 
            {name: 'Location', index: 'Address', jsonmap: 'Address', width: 150}, 
            {name: 'Phone', index: 'Phone', jsonmap: 'Phone', width: 125, align: 'center'}, 
            {name: 'Agent', index: 'Agent', jsonmap: 'Agent', width: 150}, 
            {name: 'Last Load', index: 'last_trx', jsonmap: 'last_trx', width: 150}
        ], 
        loadonce: true, 
        shrinkToFit: false, 
        width: 600, 
        rowNum: 20, 
        rowList: [10, 20, 30, 40, 50, 100], 
        repeatitems: false, 
        jsonReader: { repeatitems: false, id: '0' }, 
        pager: '#companies_pager', 
        caption: 'Company List', 
        data: [
            {ID: 'cmp1', Name: 'Name1', Address: 'Address1', Phone: 'Phone1', Agent: 'Agent1', last_trx: 'last_trx1'}, 
            {ID: 'cmp2', Name: 'Name2', Address: 'Address2', Phone: 'Phone2', Agent: 'Agent2', last_trx: 'last_trx2'}
        ]
    });

ID,电话和代理都显示出来(因为它们的数据源名称完全相同)。但是,公司名称,位置和上次加载均未显示。我认为使用jsonmapjsonReader: { repeatitems: false}允许您为JSON对象提供与colNames对象不同的名称。

非常感谢所有帮助。

更新 对不起,我迟到了。这就是代码看不出测试的方式。 _data.rows是一个JSON对象数组。

var noRecords = $('<div>No results for the entered company name.</div>');
        grid.jqGrid({
            datatype: 'local',
            colNames: ['ID', 'Company Name', 'Location', 'Phone', 'Agent', 'Last Load'], 
            colModel: [
                {name: 'ID', jsonmap: 'ID', width: 75}, 
                {name: 'Company Name', jsonmap: 'Name', width: 150}, 
                {name: 'Location', jsonmap: 'Address', width: 150}, 
                {name: 'Phone', jsonmap: 'Phone', width: 125, align: 'center'}, 
                {name: 'Agent', jsonmap: 'Agent', width: 150}, 
                {name: 'Last Load', jsonmap: 'last_trx', width: 150}
            ], 
            loadonce: true, 
            shrinkToFit: false, 
            width: 600, 
            rowNum: 20, 
            rowList: [10, 20, 30, 40, 50, 100], 
            repeatitems: false, 
            jsonReader: { repeatitems: false, id: '0' }, 
            pager: '#companies_pager', 
            caption: 'Company List', 
            loadComplete: function() {
                if(grid[0].p.reccount === 0) {
                    noRecords.show();
                }
                else {
                    noRecords.hide();
                }
            }
        });
/* Get the list of companies based on the search criteria */
function getCompanies() {
    var company = document.getElementById('company').value;
    if((company != '') && (company != oldCompany)) {
        oldCompany = company;
        myAjax('get', {method: 'getCompanies', a: 'companies', data: company}, callbackGetCompanies);
    }
}
/* Parse the server response */
function callbackGetCompanies(_data) {
    if(_data && _data.message) {
        if(_data.message == 'true') {
            grid.jqGrid('clearGridData').jqGrid('setGridParam', {data: _data.rows, page: 1}).trigger('reloadGrid');
        }
        else {
            dialog(_data.message);
        }
    }
    else {
        serverError();
    }
}

1 个答案:

答案 0 :(得分:2)

您在演示中遇到的问题更多。

  1. 如果您使用datatype: 'local'data参数中的输入数据将由localReader而非jsonReader管理。 repeatitems localReader的值已经错误了。所以正确的方法是使用localReader: { id: 'ID' }
  2. 如果使用datatype: 'local'loadonce: true选项将被忽略,因为数据已经是本地数据,不应从服务器加载一次。
  3. 如果您使用datatype: 'local'jsonmap将被忽略。该属性仅在datatype: 'json'datatype: 'jsonstring'
  4. 的情况下使用
  5. 如果您使用datatype: 'local',则index属性的值必须name属性的值相同。只有在本地排序才能正常工作的情况下。
  6. 您不应在' '属性中使用空格namename属性中没有meta-characters
  7. 所以你必须使用namedata数组中属性的名称:

    colModel: [
        {name: 'ID', index: 'ID', width: 75},
        {name: 'Name', index: 'Name', width: 150},
        {name: 'Address', index: 'Address', width: 150},
        {name: 'Phone', index: 'Phone', width: 125, align: 'center'},
        {name: 'Agent', index: 'Agent', width: 150},
        {name: 'last_trx', index: 'last_trx', width: 150}
    ],
    localReader: { id: 'ID' },
    

    我认为没有理由为什么你需要在输入数据中拥有其他name属性。