JQgrid save and recover object from column

Question

It is posible to save a complex objet into a column and to recover it after.

This is an example: Json:

[{"datamain":"mydata",
       "address":{"data1":15,"data2":0.0,"data3":"1000"}}
}]

Jqgrid:

jQuery("#rowed5").jqGrid({  
        datatype: "local",
        loadtext:"Loading...",
        colNames:['Name',
                  'obaddress'],
        colModel:[
        {name:'datamain',index:'datamain', width:200,editable: true,edittype:'text'},
        {name:'address',index:'address', width:30, editable: false,hidden : true,edittype:'text'}
                ],
        cellsubmit: "clientArray",  
        pager:"#pager"
    });

If I try to access addres:

 var rowData = $("#rowed5").getRowData(rowid);
var myaddress= rowData['address'];

Then I get '[object Object]' but it is a string!!! I can not do: myaddress.data1

Any recommendation???

Picnic

Answer 1

If I correctly understand your problem you can do the following:

var rowData = $("#rowed5").jqGrid("getLocalRow", rowid);
alert("data3=" + rowData.address.data3);

By the way to save the address part you don't need to create hidden column "address". So you don't create any hidden column in the table to hold any row specific custom data. You should just fill the data like you do as typically: using data option of jqGrid:

var mydata = [
    {
        id: "10",
        "datamain": "mydata",
        "address": {"data1": 15, "data2": 0.0, "data3": "1000"}
    },
    {
        id: "20",
        "datamain": "mydata2",
        "address": {"data1": 18, "data2": 0.1, "data3": "3000"}
    }
];

$("#rowed5").jqGrid({
    datatype: "local",
    data: mydata,
    colNames: ['Name'],
    colModel: [
        {name: 'datamain', width: 300, editable: true}
    ],
    height: "auto",
    ...
});

In the case all the data will be saved in the internal data parameter of jqGrid. You can use $("#rowed5").jqGrid("getGridParam", "data") to return all the data or use $("#rowed5").jqGrid("getLocalRow", rowid) to return the data of the specified row only.

The small demo demonstrate the approach live. The data are displayed one row per page. So you can go to the next page and modify the data using cell editing. After saving the "address" information from the current cell will be displayed.

Klingensmith

I just resolved the problem. The main proble was that I have to load data on this way: jQuery("#rowed5") .jqGrid('setGridParam', { datatype: 'local', data:mydata }) .trigger("reloadGrid"); – Picnic

Good call on "getLocalRow" method. This returned the object as apposed to "getRowData" which returned the string. Thanks. – Rallentando

@styfle: You are welcome! Additional advantage of getLocalRow and internal data and _index is the following: if mydata contains additional properties there will be save in exactly the same form as input data. So one need no hidden columns and one can even save complex objects associated with rows. See the answer and the answer where nested subgrid information will be hold in data and be accessed using getLocalRow. – Klingensmith

Answer 2

I just resolved the problem. The main problem was that I have to load data on this way:

        jQuery("#rowed5")
        .jqGrid('setGridParam',
            { 
                datatype: 'local',
                data:mydata
            })
        .trigger("reloadGrid");

You don't have to do this:

       jQuery("#rowed5").jqGrid("clearGridData", true);
        for(var i=0;i < data.item.length;i++){
            jQuery("#rowed5").jqGrid('addRowData',i,data.item[i]);
        }

Picnic