angularjs - Enabling grouping in ng-table removes the pagination -


i'm working ng-table , i've run issue grouping. have grouping can enabled or disabled selecting options in dropdown menu enabling grouping breaks pagination while works fine when grouping disabled.

here's example of 1 of objects in columns array looks like:

{   field: "payeename",   title: "charity",   sortable: "payeename",   filter: {     payeename: 'select'   },   classes: "td-width-150",   show: true,   hideonexport: true,   groupable: "payeename",   buildtemplate: function(donation, idx) {     var str = donation.payeename + '<br/>';     str += '<small class="text-muted">';     str += $filter('buildaddressline')(donation) + '<br/>';     str += $filter('buildregistrationid')(donation) + '<br/>';     if (donation.designation) {       str += donation.designation;     }     str += '</small>';     return str;   } } 

here rows appear when grouping either turned on or off:

<tr class="ng-table-group" ng-show="grouping" ng-repeat-start="group in $groups">  <td>     <a href="" ng-click="group.$hiderows = !group.$hiderows">       <span class="glyphicon" ng-class="{ 'glyphicon-chevron-right': group.$hiderows, 'glyphicon-chevron-down': !group.$hiderows }"></span>       <strong>{{ group.value }}</strong>     </a>   </td> </tr> <tr ng-show="grouping" ng-hide="group.$hiderows" ng-repeat="user in group.data" ng-repeat-end>   <td ng-repeat="col in $columns track $index" class="{{col.classes}}" {{col.hide}} ng-bind-html="col.buildtemplate(user, $index)"></td> </tr> <tr ng-show="!grouping" ng-repeat="user in $data">   <td ng-repeat="col in cols track $index" class="{{col.classes}}" {{col.hide}} ng-bind-html="col.buildtemplate(user, $index)"></td> </tr> 

lastly, here function preps data table. should known below code api call sets $scope.donations equal endpoint returns:

var prepdata = function(checkfilter) {   var orderfilter = params.filter();   // add grid filters data loaded in data   var filtereddata = params.filter() ? $filter('filter')($scope.donations, params.filter()) : $scope.donations;   // apply global filter    filtereddata = $filter('filter')(filtereddata, $scope.globaltablefilter);     var ordereddata = params.sorting() ?     $filter('orderby')(filtereddata, params.orderby()) :     filtereddata;    ordereddata = $filter('filter')(ordereddata, $scope.filterdonation);    // prep data export   $scope.exportdata = angular.copy(ordereddata);   $scope.exportdata.foreach(function(e) {     e.donationdate = $filter('date')(e.donationdate, 'dd/mm/yyyy');     e.receiptamount = $filter('currency')(e.receiptamount);   });   // recalc pagination - must preceed page slice    params.total(ordereddata.length);   $scope.$emit('gotdonations', $scope.ordereddata);    $scope.filterdonations = ordereddata.slice((params.page() - 1) * params.count(), params.page() * params.count());   return $scope.filterdonations;  }; 

when grouping enabled via select input, fires function looks like: $scope.tabledonationparams.group({payeename: 'asc'})
when grouping disabled via select input, fires this:
$scope.tabledonationparams.group({})

like said, pagination works fine whenever grouping set blank object, breaks when enabled.

here image of table clarity: http://imgur.com/f6wyksa

i integrated plugin called angular-dragdrop allow me drag items sidebar table added columns object , drag columns on each other change positioning on table don't let confuse you.

thank , help.

i've same problem, when paging on group data. so, add these lines @ end on getgroups function [ng-table.js].

if (!settings.dataoptions.applypaging) {     return ngtabledefaultgetdata(result, params); } return ngtabledefaultgetdata.applypaging(result, params); 

the pagination working on either used default or custom.


Comments