Update infragistics igGrid with composite primaryKeys in jQuery

Question

I am using Infragistics igGrid where I have multiple primary keys:

 $("#grid_selector").igGrid({
            autoCommit: true,
            width: "100%",
            height: '500px',
            autoGenerateColumns: false,
            primaryKey: "TrackTrainId,ClassCode",
            columns: [
                { headerText: "Class Code", key: "ClassCode", dataType: "string" },
                { headerText: "Track/Train", key: "TrackTrainId", dataType: "string" },
                { headerText: "Cars", key: "NumberOfCars", dataType: "number" },
                { headerText: "Loads", key: "LoadEquipments", dataType: "string" },
                { headerText: "Empties", key: "EmptyEquipments", dataType: "string" },
                { headerText: "Tons", key: "Tons", dataType: "number" },
                { headerText: "Feet", key: "Feet", dataType: "number" },
            ],
            features: [
                {
                    name: "Updating",
                    editMode: "none",
                    enableAddRow: false,
                    enableDeleteRow: false
                }
            ]
        });

The grid will not have any data initially. When user click on Add Row button, it will call another function to add new row in the grid. Following is the code for Add Row which works fine:

//add rows to the grid to show selected equipments first time
AddRowForEquipmentSelectedGrid = function (track_info, ul_eq) {
var selctd = $('#' + ul_eq + ' li.ui-selected'),
    grid = $("#grid_selector");

var rowObj = {
    "TrackTrainId": track_info.TrackTrainId,
    "ClassCode": track_info.ClassCode,
    "NumberOfCars": track_info.NumberOfCars,
    "LoadEquipments": track_info.LoadEquipments,
    "EmptyEquipments": track_info.EmptyEquipments,
    "Tons": track_info.Tons,
    "Feet": track_info.Feet
};

grid.igGridUpdating("addRow", rowObj);
};

The problem comes when I try to update the grid row. How do I pass the primary keys. If I have any one primary key then this code works fine. I am passing multiple keys as { "TrackTrainId": track_id, "ClassCode": class_code }.

//on update equipment
UpdateEquipmentGrid = function (track_id, class_code, total_cars, txt_load, txt_emp, txt_tons, txt_feet) {
var rowObj = {
    "NumberOfCars": total_cars,
    "LoadEquipments": txt_load,
    "EmptyEquipments": txt_emp,
    "Tons": txt_tons,
    "Feet": txt_feet
};
$('#grid_selector').igGridUpdating("updateRow", { "TrackTrainId": track_id, "ClassCode": class_code }, rowObj);
}

Don't know if that is the correct way. Any suggestion what I am doing wrong here.

Answer 1

Currently the igGrid does not support composite primary keys. You can combine the values from the different columns into a single field and use that as a primary key. For example:

 rowObj.CompositeKey = rowObj.ClassCode + "|" + rowObj.TrackTrainId;

And you can update the related row based on that composite value:

 $("#grid").igGridUpdating("updateRow", "another random string|some random string", { NumberOfCars: 1000 });

You can refer to the following JSFiddle example here: http://jsfiddle.net/2uf32hm3/2/