In jqxGrid, how do I add a new calculated column from JSON data?

In jqxGrid, how do I add a new calculated column from JSON data?

My JSON data has fields baseQuantity and unitCost. I want to add a new field called totalCost which would be baseQuantity * unitCost.

I'm trying to add the data using loadComplete, but it doesn't seem to work.

ANOTHER alternative I could do is to loop through objData and inject a new field with the calculated value. But aside from that, is there any way I could do it via jqxGrid's API?

var jsonString = [{ "baseQuantity":"1", "unitCost":"2"}, { "baseQuantity":"3", "unitCost":"4"}];
var objData = $.parseJSON(jsonString);

var srcData = {
        datatype: "json",
        datafields: [ 
            { name : 'baseQuantity', type : 'number' },
            { name : 'unitCost', type : 'number' }
        ],
        localdata : objData
    };

var adapterData =  new $.jqx.dataAdapter(srcData, {
    loadComplete: function (records) {
        var modifiedDataArray = new Array();
        for (var i = 0; i < records.length; i++) {

            var modifiedData = records[i];
            modifiedData.totalPayment = modifiedData.baseQuantity * modifiedData.unitCost;

            modifiedDataArray.push(programme);
        }
        return modifiedDataArray;
    }
});

$('div#jqxGrid').jqxGrid({
    width: '100%',
    source: adapterData,
    theme: getTheme(),
    pageable: true,
    autoheight: true,
    sortable: true,
    altrows: true,
    columns: [
        { datafield: 'baseQuantity', text: 'Base Qty.', width: 120 }
        { datafield: 'unitCost', text: 'Unit Payment' , width: 120 }
    ]
});