CODEWITHSUNDEEP
htmljqgrid
Mike
Mike

Reputation: 435

Add column values together in jqGrid and insert into label

I have a jqGrid inside of a div orderForm that can have a verifying number of rows added to it by a user.

What I would like to do is: whenever a user adds a row to the jqGrid, the totals in the TOTAL_LINE_AMOUNT column are added together and inserted into the label Subtotal

 $('#orderForm).jqGrid({
        data: details,
        datatype: 'local',
        colNames: ['ID', 'QUANTITY', 'MODEL_ORDER_NUM', 'DESCRIPTION', 'PRICE_EACH', 'TOTAL_LINE_AMOUNT'],
        colModel: [
            { name: 'DETAIL_RECORD_ID', index: 'DETAIL_RECORD_ID', sorttype: 'string' },
            { name: 'QUANTITY', index: 'QUANTITY', sorttype: 'string' },
            { name: 'MODEL_ORDER_NUM', index: 'MODEL_ORDER_NUM', sorttype: 'string' },
            { name: 'DESCRIPTION', index: 'DESCRIPTION', sorttype: 'string' },
            { name: 'PRICE_EACH', index: 'PRICE_EACH', sorttype: 'string' },
            { name: 'TOTAL_LINE_AMOUNT', index: 'TOTAL_LINE_AMOUNT', sorttype: 'string' }
        ],
        search: true,
        onSelectRow: LoadInput,
        loadonce: false,
        jsonReader: { cell: '' },
        sortname: 'DETAIL_RECORD_ID',
        sortorder: 'asc',
        sortable: true,
        ignoreCase: true,
        viewrecords: true,
        height: 'auto',
        width: 'auto',
        shrinkToFit: false,
        hiddengrid: false,
        caption: 'Detail Records'
    });

UPDATE: Here is how I load data into my grid

Form.Controller.orderForm = new function () {
  var _detailRecordId = 1;
  this.Create = function () {
    var requestData = Controller.GetRequestData();
    requestData.orderForm.push({
        DETAIL_RECORD_ID: "T" + _detailRecordId++,
        REQUEST_RECORD_ID: requestData.REQUEST_RECORD_ID,
        QUANTITY: $('#orderForm_QUANTITY_INPUT').val(),
        MODEL_ORDER_NUM: $('#orderForm_MODEL_ORDER_NUM_INPUT').val(),
        DESCRIPTION: $('#orderForm_DESCRIPTION_INPUT').val(),
        PRICE_EACH: $('#orderForm_PRICE_EACH_INPUT').val(),
        TOTAL_LINE_AMOUNT: $('#orderForm_TOTAL_LINE_AMOUNT_INPUT').text()
    });
    Form.View.orderFrom.LoadGrid(requestData.orderForm);
};

Upvotes: 0

Views: 1016

Answers (1)

tpeczek
tpeczek

Reputation: 24125

Your code doesn't show which editing mechanism your are using with jqGrid so it is hard to say on which event you should subscribe (most porobably it should be either jqGridInlineAfterSaveRow or jqGridAddEditAfterComplete).

Getting the sum of column is very simple as jqGrid has a ready to use method for this:

var subTotal = $('#orderForm').jqGrid('getCol', 'TOTAL_LINE_AMOUNT', false, 'sum');

Depending of what kinf of HTML element your label is you should be able to set its text with one of following:

$('#Subtotal').text(subTotal);

or

$('#Subtotal').val(subTotal);

Upvotes: 1

Related Questions