Summary row without using grouping

[Digital Logix]

My grid is using remote data with paging, sorting and filtering. I want to show a summary row without using grouping. I am using the following method in grid complete event:


                var grid1 = pq.grid("div#grid_paging", obj);
               
                function calculateSummary() {
                    var grd = $("div#grid_paging");
                    var data = grd.pqGrid('option', 'dataModel.data');
                    if (data.length > 0)
                    {
                        var totalSum = 0;
                        for (var i = 0, len = data.length; i < len; i++) {
                            var rowData = data;
                            totalSum += parseFloat(rowData["Amount"]);
                        }

                        var cm = grd.pqGrid('option', 'colModel');
                        var srow = [];
                       
                        for (var i = 0; i < cm.length; i++) {
                            var column = cm;
                            if (column.dataIndx == "Amount") {
                                srow.push("Total: " + totalSum);
                            }
                            else {
                                srow.push("");
                            }
                        }

                        var sumRows = [];
                        sumRows.push(srow);
                        grd.pqGrid({ summaryData: sumRows });
                        grid1.refresh();
                    }
                }


It is showing an empty summary row.

[paramvir]

Trial version shouldn't be used for more than 30 days.

http://paramquery.com/pro/license/evaluate

If you need more time for evaluation, please write to [email protected] for extension.

thanks

[paramvir]

you haven't posted complete code but it seems that you have array of objects in dataModel.data

srow should also be an object in that case.

Code: [Select]

srow = {  Amount: "Total: " + totalSum }


[Digital Logix]

Thanks, changing srow to object fixed the issue.

It is now showing summary row correctly.

How can I hide the checkboxes and custom icons (used for custom button) in summary row.

Please check my work at:

http://digitallogix.net/pqtest/

[paramvir]

Please use column.render to override the default rendering of summary row.

First add a custom property to srow:
srow = {  Amount: "Total: " + totalSum, pq_grandsummary: true };

Then in checkbox and custom button columns:

Code: [Select]

column.render = function(ui){
  if( ui.rowData.pq_grandsummary){
     return "";
  }
}


[Digital Logix]

Thanks it works.

I have another question, the summary row did not show when using virtual scrolling.

[Digital Logix]

Please let me know if Manual Summary Row works with virtual scrolling.

Thanks

[paramvir]

yes it works.

As far as the summary data is concerned there are 2 options:

1) Server side: Calculate it on the server side and update summaryData option only once.

or

2) Browser side: re-calculate summaryData in every load event or dataModel.getData() callback and update summaryData option

Code: [Select]

this.option( "summaryData", [ summaryRows ] );


[Digital Logix]

Yes it works with virtual scrolling. The issue was that I was setting showBottom to false, that is why it was not showing the summary row.

I am using client side option and calculating the summary data in load event and it is working fine.