jQuery UI Widgets › Forums › Grid › Grid aggregates accessing other column summary data
Tagged: aggregates, aggregatesrenderer, custom, getcolumnaggregateddata, grid, jqxgrid
This topic contains 21 replies, has 3 voices, and was last updated by assaf.frank123 10 years, 10 months ago.
-
Author
-
This is not a good solution –
My calculation is the average cost of an item = (totalCost / totalNumItems) which is not equal
the some or average of each row..Any other solution I can access the summary row after the table is loaded and insert my values then
(I would access the summaryData for both columns and set the required value)?Thanks
Hi assaf.frank123,
Here is the solution, based on our previous example:
<!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" /> <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxmenu.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.selection.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxgrid.aggregates.js"></script> <script type="text/javascript" src="../../jqwidgets/jqxcheckbox.js"></script> <script type="text/javascript" src="../../scripts/demos.js"></script> <script type="text/javascript" src="generatedata.js"></script> <script type="text/javascript"> $(document).ready(function () { // prepare the data var data = generatedata(200); var source = { localdata: data, datatype: "array", datafields: [ { name: 'firstname', type: 'string' }, { name: 'lastname', type: 'string' }, { name: 'productname', type: 'string' }, { name: 'quantity', type: 'number' }, { name: 'price', type: 'number' } ], updaterow: function (rowid, rowdata, commit) { // synchronize with the server - send update command commit(true); } }; var dataAdapter = new $.jqx.dataAdapter(source); // initialize jqxGrid $("#jqxgrid").jqxGrid( { width: 670, source: dataAdapter, showstatusbar: true, statusbarheight: 25, altrows: true, showaggregates: true, ready: function () { var sumQuantity = $("#jqxgrid").jqxGrid('getcolumnaggregateddata', 'quantity', ['sum']); var sumPrice = $("#jqxgrid").jqxGrid('getcolumnaggregateddata', 'price', ['sum']); sum = sumQuantity.sum / sumPrice.sum var color = "green"; if (sum < 0) { color = "red"; }; $("#totalAggregates").css("color", color); $("#totalAggregates").text(sum); }, columns: [ { text: 'First Name', columntype: 'textbox', datafield: 'firstname', width: 90 }, { text: 'Last Name', datafield: 'lastname', columntype: 'textbox', width: 90 }, { text: 'Product', datafield: 'productname', width: 170, aggregates: [{ 'Total': function (aggregatedValue, currentValue, column, record) { return '<span id="totalAggregates"></span>'; } }], aggregatesrenderer: function (aggregates, column, element) { return aggregates.Total; } }, { text: 'Quantity', datafield: 'quantity', width: 100, cellsalign: 'right', cellsformat: 'n2', aggregates: ["sum"] }, { text: 'Price', datafield: 'price', cellsalign: 'right', cellsformat: 'c2', aggregates: ["sum"] } ] }); }); </script> </head> <body class='default'> <div id='jqxWidget'> <div id="jqxgrid"> </div> </div> </body> </html>
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/Hi Dimitar,
going back to my issue of needing to set a value in the “total” bottom line – without actually performing all the aggregates functions etc.
(so the browser will not crash with many rows).Is there any way to access the aggregates total row’s HTML directly and setting my content there myself?
If possible – I wish to implement an on Filter function that will access the newly calculated (after the filter) sum of column A and divide it by
by the newly sum of column b – the result is to be set directly in column C.If I can just access the totals row and fetch A & B and set C this will work even with many rows (will be done only once).
Any option for this?
Thanks,
Hi assaf.frank123,
That is just what has been done in the last example we provided you. Please check it out and note the span with id totalAggregates, which you can access and update any time you need.
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/OK , this works but there are 2 issues-
1. It works only if the column is a text input column. If I use columntype: ‘numberinput’ this will not work (expect a number to be
returned in the aggregates and not a String (the span string) – any way around this? achieve what I want event with a number input column?
2. Later in the code I perform a change of the table width –
$(‘#jqxgrid’).jqxGrid({ height: tableHeight });This is in order to use the maximum height available according to screen resolution (autoheight has limitations regarding the column headers
not being in place).This causes the renderer function to execute once more after the grid ready function that performs the initialization of the aggreagateTotal
span – the value is erased by this. Any way to prevent this? or achieve the maximum height available without changing by API?Thanks
Hi assaf.frank123,
1) For a “numberinput” you can change this:
aggregatesrenderer: function (aggregates, column, element) { return aggregates.Total; }
with this:
aggregatesrenderer: function (aggregates, column, element) { var sumQuantity = $("#jqxgrid").jqxGrid('getcolumnaggregateddata', 'quantity', ['sum']); var sumPrice = $("#jqxgrid").jqxGrid('getcolumnaggregateddata', 'price', ['sum']); sum = sumQuantity.sum / sumPrice.sum return sum; }
and the span will not be needed any longer.
2) You can set the height to “100%”, as in the mobile demo Default Functionality.
Best Regards,
DimitarjQWidgets team
http://www.jqwidgets.com/Thanks.
That did the trick and works fine with many records in the grid. -
AuthorPosts
You must be logged in to reply to this topic.