3

jqxGrid中,如何从 JSON 数据添加新的计算列?

我的 JSON 数据有字段baseQuantityunitCost. 我想添加一个名为totalCostbaseQuantity * unitCost 的新字段。

我正在尝试使用 loadComplete 添加数据,但它似乎不起作用。

我可以做的另一种选择是遍历 objData 并使用计算值注入一个新字段。但除此之外,有什么方法可以通过 jqxGrid 的 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 }
    ]
});
4

2 回答 2

3

使用 cellrenderer 函数:

http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-api.htm

{ text: 'totalCost', datafield: 'totalCost', width: 70, cellsalign: 'right', columntype: 'number',
  cellsrenderer: function (row, columnfield, value, defaulthtml, columnproperties) {
            var rowData = $("#jqxGrid").jqxGrid('getrowdata', row);
            return rowData.baseQuantity * rowData.unitCost;
        }   
}
于 2013-08-14T16:23:24.370 回答
0

不要使用事件“loadComplete”,而是使用“beforeLoadComplete”。这是一个例子:

var dataAdapter = new $.jqx.dataAdapter(source,
    {
        beforeLoadComplete: function (records) {
            records[0]['firstname'] = "Michael";
            return records;
        }
    }
);

比您可以遍历所有记录,并生成计算列。这是他们似乎在这里给出的官方解决方案:http ://www.jqwidgets.com/community/topic/computed-column/

于 2013-10-10T20:23:16.027 回答