让jqGrid在列中显示原始json

时间:2013-03-18 17:03:09

标签: json jqgrid

我有一个用例,我想让jqGrid为特定列显示一些原始JSON。我从服务器发送了以下JSON:

{"items":[
    {
        "code":"ABC123",
        "description":"",
        "custom_data":{"items":[
            {"prop1":"val1","prop2":"val2"},
            {"prop1":"val3","prop2":"val4"}
        ]}
    },
    {"code":"ABC124","description":"","custom_data":[]},
    ...,
]}

和jqGrid配置如下:

{
url:'/api/somewhere',
datatype: "json",
jsonReader : {
    root:"items",
    repeatitems: false,
    id: "code"
},
colNames:['Code',
          'Description',
          'Data',],
colModel:[
    {   
            name:'code', index:'code', width:100, hidden:false, 
        edittype:'text', 
        editable: true, 
        editrules:{required:true, edithidden:true}, 
        editoptions: {readonly:false}
    },
    {   
            name:'description', 
            index:'description', 
            width:250, 
            editable:true, 
            edittype:'text', 
            editrules:{required:true} 
        },
    {
    name:'custom_data',
    index:'custom_data', 
    width:100, 
    hidden:true, 
    sortable:false, 
    editable:true, 
    edittype:'text', 
    editrules:{required:false, edithidden:true}
    },
],
    ...,

网格显示OK,但custom_data列显示为[object Object]。我需要的是它显示我尝试使用loadComplete事件在每个行对象的custom_data对象上调用JSON.stringify的原始JSON字符串,但是这不起作用。无论如何,我需要在GET之后进行一些数据操作,因为我想从custom_data对象中删除空值。

我的用户可以轻松阅读和编辑原始JSON,因此我还需要添加/编辑表单来接受原始JSON,然后将获得POST。

我不确定我是否只是使用错误的事件将对象转换回字符串,或者是否还有其他事情发生。

1 个答案:

答案 0 :(得分:1)

您可以使用"custom_data"

的自定义格式化程序
formatter: function (cellValue, options, rawData) {
    return cellValue.items ? JSON.stringify(cellValue.items) : "";
}

我将hidden列的the demo "custom_data"属性更改为true以查看数据

enter image description here

此外,您可以考虑使用userdata而不是隐藏列来保存其他自定义数据。我建议您另外阅读the answer,其中不仅展示了如何使用userdata,还展示了如何在子网格中显示其他数据。