jquery jqgrid propery with dot operator

Question

I have a json with a property having dot "." operator in it. When im trying to render my grid, it comes up as blank (without any errors).

Here's my JSON:

{
            "total":1,
        "page":1,
        "records":2,
        "rows":[{
                "id":2110040,
                "cell":{
                "function.code":"dsadad",
                        "service.name":"dsadasda"

                }
            },
            {
                "id":2115040,
                "cell":{
                 "function.code":"iuiyuiy",
                     "service.name":"iyuiyuiy"

                }
            }
        ]
    }

this is my colModel

colModel : [ {
        name : 'service.name',
        search : 'true',
        editable : true,
        //index : 'service.name',
        width : 200,
        jsonmap : "cell.service.name"           
    },
    {
        name : 'function.code',
        search : 'true',
        editable : true,
        sortable:true,
        //index : 'function.code',
        width : 200,
        jsonmap : "cell.function.code"          
    }],

JSON reader is:

jsonReader : {
        repeatitems : false,
        root : "rows",
        cell : "cell",
        id : "id",
        page : "page",
        records : "records"
    },

Please help,what am i missing here ??

Thanks!

Answer 1

I find you question interesting. It's close to the problem described here, but in case of JSON instead of XML.

The problem is that jqGrid try to read rows with respect of obj.cell.function.code instead of obj.cell['function.code']. To let jqGrid to read the data correctly you can use functions as the jsonmap:

colModel: [
    {
        name: 'service_name',
        search: 'true',
        editable: true,
        width: 200,
        jsonmap: function (obj) {
            return obj.cell['service.name'];
        }
    },
    {
        name: 'function_code',
        search: 'true',
        editable: true,
        sortable: true,
        width: 200,
        jsonmap: function (obj) {
            return obj.cell['function.code'];
        }
    }
]

How you can see on the demo the approach work.