how to bind complex JSON objects to JQGrid? RRS feed

  • Question

  • User522078068 posted


    I have a JSON object containg CarDetails which inside has a property called Drivers and TravelCompanies. I have a column called DriverName and TravelCompanyName in my JQGrid. When i tried to bind the grid the DriverName and TravelCompanyName  column was empty, then i added the below code

    for (var i = 0; i < jsonData.length; i++) {
    var data = {
    "DriverName": jsonData[i].Drivers[i].DriverName,
    "TravelCompanyName": jsonData[i].TravelCompanies[i].TravelCompanyName
    $('#jqGridCarList').jqGrid('addRowData', i, data);

    now this two columns are getting binded but in the new rows. How to fix this issue?

    Tuesday, June 21, 2016 11:23 AM


  • User1559292362 posted

    Hi ziaulrahman,


    now this two columns are getting binded but in the new rows. How to fix this issue?

    According to your description, Do you want to delete old rows before add rows to your jqGrid? if so, please refer to:

    #Delete a specific row

    function deleteGridRow(){
        var rowID = returnRowID();
        var colDomainID = jQuery('#list').jqGrid('getCol','domain_id',false)[rowID-1]; 
        var colCodeGroup = jQuery('#list').jqGrid('getCol','code_group',false)[rowID-1];
        var strURL = "source/common/get_code_header.asp";
        strURL = strURL + "?domain_id=" + colDomainID;                 //domain_id and code_group is group-key
        strURL = strURL + "&code_group=" + colCodeGroup;
        if( rowID != null ) jQuery("#list").jqGrid('delGridRow',rowID,{url:strURL,reloadAfterSubmit:false});
        else alert("Please Select Row to delete!");


    #Delete all rows.

    var myGrid = $("#list"); // the variable you probably have already somewhere
    var gridBody = myGrid.children("tbody");
    var firstRow = gridBody.children("tr.jqgfirstrow");


    Best regards,

    Cole Wu

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Wednesday, June 22, 2016 9:04 AM