{"id":123961,"date":"2015-06-29T10:23:43","date_gmt":"2015-06-29T08:23:43","guid":{"rendered":"http:\/\/guriddo.net\/?post_type=kbe_knowledgebase&#038;p=123961"},"modified":"2015-07-14T10:06:48","modified_gmt":"2015-07-14T08:06:48","slug":"customized-aggregations-in-grouping","status":"publish","type":"kbe_knowledgebase","link":"http:\/\/guriddo.net\/?kbe_knowledgebase=customized-aggregations-in-grouping","title":{"rendered":"Customized Aggregations in grouping"},"content":{"rendered":"<p>We know that when using grouping we can define a lot of custom options to perform calculations on certain column. For this purpose a custom <a href=\"http:\/\/www.trirand.com\/jqgridwiki\/doku.php?id=wiki:grouping#colmodel_options\" target=\"_blank\">summaryType<\/a> can be used. This is good in most cases, but in certain situations we need to perform complex calculations\u00a0 using the\u00a0 calculated data of more than one columns. Example of this can be the difference\u00a0 of two summary columns as percentage.<\/p>\n<p>In this article I will describe how this can be done.<\/p>\n<p>General we will use two colModel properties &#8211; <a href=\"http:\/\/www.trirand.com\/jqgridwiki\/doku.php?id=wiki:custom_formatter\" target=\"_blank\">formatter<\/a> and <a href=\"http:\/\/www.trirand.com\/jqgridwiki\/doku.php?id=wiki:grouping#colmodel_options\" target=\"_blank\">summaryType<\/a>. Both of these options will be defined as custom functions.<\/p>\n<p>It is unknown maybe that the summaryType\u00a0 when defined as function can return\u00a0 object to store the calculations. We will use this property again with custom formatter which should place the calculated value on the right place.<\/p>\n<p>Let suppose that we need to calculate the difference of two summary columns in percentage and put the result in another column.<\/p>\n<p>The colModel can look like this<\/p>\n<p>[code]<\/p>\n<p>colModel: [<br \/>\n{ label: &#8216;Inv No&#8217;, name: &#8216;id&#8217;, width: 75, key:true },<br \/>\n{ label: &#8216;Date&#8217;, name: &#8216;invdate&#8217;, width: 90 },<br \/>\n{ label: &#8216;Client&#8217;, name: &#8216;name&#8217;, width: 100 },<br \/>\n{ label: &#8216;Amount&#8217;, name: &#8216;amount&#8217;, width: 80 },<br \/>\n{ label: &#8216;Tax&#8217;, name: &#8216;tax&#8217;, width: 80 },<br \/>\n{ label: &#8216;Total&#8217;, name: &#8216;total&#8217;, width: 80 },<br \/>\n{ label: &#8216;Notes&#8217;, name: &#8216;note&#8217;, width: 150 }<br \/>\n],<\/p>\n<p>[\/code]<\/p>\n<p>In this scenario we will make a summary of columns Amount and Tax and put the difference in percentage in the Total column. To do this we need to define the grouping and the summary types:<\/p>\n<p>[code]<br \/>\ncolModel: [<br \/>\n{ label: &#8216;Inv No&#8217;, name: &#8216;id&#8217;, width: 75, key:true },<br \/>\n{ label: &#8216;Date&#8217;, name: &#8216;invdate&#8217;, width: 90 },<br \/>\n{ label: &#8216;Client&#8217;, name: &#8216;name&#8217;, width: 100 },<br \/>\n{ label: &#8216;Amount&#8217;, name: &#8216;amount&#8217;, width: 80, summaryType: &#8216;sum&#8217;, formatter:&#8217;number&#8217; },<br \/>\n{ label: &#8216;Tax&#8217;, name: &#8216;tax&#8217;, width: 80, summeryType: &#8216;sum&#8217;, formatter: &#8216;number&#8217; },<br \/>\n{ label: &#8216;Total&#8217;, name: &#8216;total&#8217;, width: 80,<br \/>\n   summaryType : function(value, name, record) {<br \/>\n      \/\/ initialize the value object<br \/>\n      if(typeof value === &#8216;string&#8217;){<br \/>\n         value = {totalAmount: 0, totalTax: 0 };<br \/>\n      }<br \/>\n      \/\/ perform summary<br \/>\n      if(record[&#8216;amount&#8217;]) {<br \/>\n         value.totalAmount += parseFloat(record[&#8216;amount&#8217;]);<br \/>\n      }<br \/>\n      if(record[&#8216;tax&#8217;]) {<br \/>\n         value.totalTax += parseFloat(record[&#8216;tax&#8217;]);<br \/>\n      }<br \/>\n      return value;<br \/>\n   },<br \/>\n   formatter: function (cellval, opts, rwdat, act) {<br \/>\n     \/\/ get the regional options and pass it to the custom formatter<br \/>\n     opts = $.extend({}, $.jgrid.getRegional(this, &#8216;formatter&#8217;) , opts);<br \/>\n     \/\/ determine if we are in summary row to put the value<br \/>\n     if (opts.rowId === &#8221;) {<br \/>\n        if(cellval.totalAmount &gt; 0) {<br \/>\n           var val = (cellval.totalAmount &#8211; cellval.totalTax)\/cellval.totalAmount*100;<br \/>\n           return $.fn.fmatter(&#8216;number&#8217;, val, opts, rwdat, act)+&#8217; %&#8217;;<br \/>\n        } else {<br \/>\n           return &#8216;0&#8217;;<br \/>\n        }<br \/>\n     } else {<br \/>\n         return $.fn.fmatter(&#8216;number&#8217;, cellval, opts, rwdat, act);<br \/>\n     }<br \/>\n  }<br \/>\n},<br \/>\n{ label: &#8216;Notes&#8217;, name: &#8216;note&#8217;, width: 150 }<br \/>\n],<br \/>\ngrouping: true,<br \/>\ngroupingView: {<br \/>\n   groupField: [&quot;name&quot;],<br \/>\n   groupColumnShow: [true],<br \/>\n   groupText: [&quot;&lt;b&gt;{0}&lt;\/b&gt;&quot;],<br \/>\n   groupOrder: [&quot;asc&quot;],<br \/>\n   groupSummary: [true],<br \/>\n   groupCollapse: false<br \/>\n}<br \/>\n[\/code]<\/p>\n<p>The trick here to put the new calculated value from formatter is to check if the rowId parameter is empty. This will grand that this is the summary value that we want to place in the summary row.<\/p>\n<p>As can be seen using custom formatter and custom summaryType we can make any calculations, which make Guriddo jqGrid a simple powerful  java script reporting engine.<\/p>\n<p>The <a href=\"http:\/\/guriddo.net\/demo\/guriddojs\/grouping\/custom_summary\/\" target=\"_blank\">demo can be seen here<\/a><\/p>\n<p>The PHP demo with source code view can be <a href=\"http:\/\/www.guriddo.net\/demo\/demos\/jqgrid\/grouping\/newavg\/default.php\">seen here<\/a><\/p>\n<p>Enjoy<\/p>\n","protected":false},"excerpt":{"rendered":"<p>We know that when using grouping we can define a lot of custom options to perform calculations on certain column. For this purpose a custom summaryType can be used. This is good in most cases, but in certain situations we [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","template":"","kbe_taxonomy":[91,92],"kbe_tags":[],"_links":{"self":[{"href":"http:\/\/guriddo.net\/index.php?rest_route=\/wp\/v2\/kbe_knowledgebase\/123961"}],"collection":[{"href":"http:\/\/guriddo.net\/index.php?rest_route=\/wp\/v2\/kbe_knowledgebase"}],"about":[{"href":"http:\/\/guriddo.net\/index.php?rest_route=\/wp\/v2\/types\/kbe_knowledgebase"}],"author":[{"embeddable":true,"href":"http:\/\/guriddo.net\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"http:\/\/guriddo.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=123961"}],"version-history":[{"count":13,"href":"http:\/\/guriddo.net\/index.php?rest_route=\/wp\/v2\/kbe_knowledgebase\/123961\/revisions"}],"predecessor-version":[{"id":124048,"href":"http:\/\/guriddo.net\/index.php?rest_route=\/wp\/v2\/kbe_knowledgebase\/123961\/revisions\/124048"}],"wp:attachment":[{"href":"http:\/\/guriddo.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=123961"}],"wp:term":[{"taxonomy":"kbe_taxonomy","embeddable":true,"href":"http:\/\/guriddo.net\/index.php?rest_route=%2Fwp%2Fv2%2Fkbe_taxonomy&post=123961"},{"taxonomy":"kbe_tags","embeddable":true,"href":"http:\/\/guriddo.net\/index.php?rest_route=%2Fwp%2Fv2%2Fkbe_tags&post=123961"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}