JQgrid total amount row

Question

iv seen an example by @Oleg for row total sum in jqgrid but i tried to apply it and it wont work i have the following grid i need to calculate the amount value for it.

colNames: ['ID', 'FTE', 'Workload'],
    colModel: [
                { name: 'ID', index: 'ID', width: 200, align: 'left', hidden: true },

                { name: 'FTEValue', index: 'FTEValue', width: 200, align: 'left', formatter: 'number' },
                { name: 'Workload', index: 'Workload', width: 200, align: 'left' },



    caption: "Activity FTE",
    gridview: true,
    rownumbers: true,
    rownumWidth: 40,
    scroll: 0,
    rowNum: 100,
    sortname: 'ID',
    pager: '#pager',
    sortorder: "asc",
    viewrecords: true,
    autowidth: true,
    height: '100%',
    footerrow: true,
    jsonReader: { root: "GridData", page: "CurrentPage", total: "TotalPages", records: "TotalRecords", repeatitems: false, id: "0" }
};



DutyFTEGrid.prototype.SetupGrid = function (selector) {
    jQuery(selector).html('<table id="grid"></table><div id="pager"></div>');
    var grid = jQuery("#grid").jqGrid(this.gridConfiguration);

    jQuery("#grid").jqGrid('navGrid', '#pager',
    { edit: false, add: false, search: false }, {}, {},
    { // Delete parameters
        ajaxDelOptions: { contentType: "application/json" },
        mtype: "DELETE",
        serializeDelData: function () {
            return ""; 
        },
        onclickSubmit: function (params, postdata) {
            params.url = serviceURL + 'DutyFTE(' + encodeURIComponent(postdata) + ')/';
        }
    });

    var grid = $("#grid");
    var sum = grid.jqGrid('getCol', 'FTE', false, 'sum');
    grid.jqGrid('footerData', 'set', { DriverEn: 'Total FTE:', FTEValue: sum });
};

Oleg your help please, i have tried your example but it didnt work for some reason.

Oleg · Accepted Answer · 2011-09-12T21:18:13.023

21

If I understand you correct you want to place in the footer getCol and footerData methods:

var grid = $("#list"),
    sum = grid.jqGrid('getCol', 'amount', false, 'sum');

grid.jqGrid('footerData','set', {ID: 'Total:', amount: sum});

The getCol can be used to calculate the sum of all numbers from the 'amount' column and with respect of footerData you can place at the bottom of the 'ID' column the text "Total:" and at the bottom of 'amount' column.

UPDATED: Probably you have problems because you place the code in the wrong place. The most safe place for the code is loadComplete event handler. Look at the demo.

edited Sep 12 '11 at 21:18

answered Sep 12 '11 at 20:39

Oleg

220,925
34
403
798

thank you man, i tired it but i dont know why the result always 0 ! – Madi Sep 12 '11 at 20:46
i was mistaken with the col name, anyway i put the correct one now and there no value at all appear, note: the values inside the cells are float like 0.3 – Madi Sep 12 '11 at 21:00
@Madi: If you want to calculate the data as float you should define float formatter in the column. Just add `formatter: 'number'` in the 'amount' column. If if will not help you should append your question with full jqGrid definition and the test data. – Oleg Sep 12 '11 at 21:09
yeah it does change the format but i still get the total 0:00 :S i don't know why, maybe it does the calculation before the rows are initialized ? – Madi Sep 12 '11 at 21:11
i have updated the question with the fill jqgrid i need to calculate the FTEValue column – Madi Sep 12 '11 at 21:17
@Madi: I updated my answer and included [the demo](http://www.ok-soft-gmbh.com/jqGrid/SimpleLocalGridWithTotalSum.htm) for you. – Oleg Sep 12 '11 at 21:18
big thanks man for your help and example, the gird never enters the loadComplete function idk why, but i have change it with gridComplete and now its just working fine. thx again m8 – Madi Sep 12 '11 at 21:38
@Madi: The `loadComplete` is the last event handler in [the execution order](http://www.trirand.com/jqgridwiki/doku.php?id=wiki:events#execution_order) so I personally prefer to use it. Moreover it has one parameter - the data in the same format in which the data are send from the server. You can even send from the server any additional information and read it inside of `loadComplete`. – Oleg Sep 12 '11 at 21:44
don't forget to set grid option -> footerrow: true – Łukasz Bańcarz Oct 10 '13 at 18:38
What if the cells with have value with other character? Something like sum of prices and the cells will looks like this: $100.00? Then when you use this functionality the result will always be NaN. – Brane Oct 31 '15 at 15:48
@user3850805: It's better you ask separate question where you exactly describe what you do: how you fill the grid and how the column is defined. If you do all correctly, `getCol` works correctly too. – Oleg Oct 31 '15 at 16:16

score 0 · Answer 2 · answered Feb 08 '12 at 20:20

Total of a price column:

//Count total for a price column
var total = 0;
$('#table tr').each(function(){

    //cells that contains the price
    var tdprice = $(this).find("td:eq(2)").html();

    //Sum it up!
    if (isNaN(tdprice)){ total += parseInt(tdprice); }
});

alert(total + "$");

JQgrid total amount row

2 Answers2

Linked