Not able to add Column Name in Jqgrid footer to calculate sum

Question

I have below code in Jqgrid which displays the Sum correctly in footer of grid

 var colSum = $("#dataGrid").jqGrid('getCol', 'Amount', false, 'sum');
 $("#dataGrid").jqGrid('footerData', 'set', { Id: "Total:", Amount: colSum });

Now, when i try to pass the ColumnName dynamically as below

 var colName = arrColAndMet[0];
 var colSum = $("#dataGrid").jqGrid('getCol', colName, false, metrics);
 $("#dataGrid").jqGrid('footerData', 'set', { Id: "Total:", colName: colSum });

I am not able to display Sum for Amount Column, However, colSum is getting calculated correctly.

What's wrong in passing ColName as variable?

Answer 1

The last parameter of footerData method is object, which property names should be "Id" and the value of colName variable. Instead of that the object literal

{ Id: "Total:", colName: colSum }

means object with properties "Id" and "colName".

On the other side one can easy solve the problem by modifying your original code to the following:

var colName = arrColAndMet[0];
var colSum = $("#dataGrid").jqGrid('getCol', colName, false, metrics);
var footerData = { Id: "Total:" };
footerData[colName] = colSum;
$("#dataGrid").jqGrid('footerData', 'set', footerData);

where one uses footerData[colName] to set property, which name will be get from variable colName.