I am using the new UI-grid and need to have a custom pagination logic for both the child and the parent grid.
There is a directive for the custom pagination and this works well when placed along with the main grid . This directive has a few methods for the pagination to set the data for the grids.
But when this directive is placed in the expandablegrid template,I wanted to access the directive methods once the main parent grid is expanded. But I am not able to access those methods
paginator directive :
app.directive('paginator', ["$parse", function ($parse) {
return {
restrict: 'E',
templateUrl: "..pagination.htm",
scope: {
datasource: "="
},
controller: ['$scope', function (scope) {
scope.datasource.computePageNumbers = function () {
//pagination logic
}
}
]
}
}]);
expandableGrid.html
<div class="row">
<div class="col-sm-12">
<div ui-grid="row.entity.subGridOptions" ui-grid-pagination class="grid"></div>
<paginator datasource="row.entity.childPagination" ></paginator>
</div>
</div>
setting values in subGridOptions
$scope.paginationData = {};
$scope.gridOptions.data[i].childPagination=paginationData;
parent grid row expansion code.
Here inside the rowselection I need to call the computePageNumbers and set data in the row.Entity.data which sets data for child grid. But I am not able to call the computePageNumbers. How to make it work ? I may not be explaining in detailed but if someone can help it would be help to me or any other alternative.
gridApi.selection.on.rowSelectionChanged($scope, function (row) {
gridApi.expandable.toggleRowExpansion(row.entity)
});