diff --git a/packages/oui-datagrid/README.md b/packages/oui-datagrid/README.md
index 87306a03..c01da3b5 100644
--- a/packages/oui-datagrid/README.md
+++ b/packages/oui-datagrid/README.md
@@ -281,6 +281,17 @@ Or you can use the `page-size` property. It takes precedence over value configur
```
+You can also add custom behaviour on pagination changes
+
+```html:preview
+
Page size : {{ $ctrl.pageSize }}
+Offset : {{ $ctrl.offset }}
+
+
+
+
+```
+
### Custom cell templates
```html
@@ -718,6 +729,7 @@ call `rows-loader` and then a `row-loader` call for each line.
| `columns-parameters` | array | | no | n/a | `undefined` | columns parameters (see below)
| `on-columns-parameters-change` | function | & | no | n/a | n/a | triggered on column parameter change when datagrid is customizable
| `on-row-select` | function | & | no | n/a | n/a | triggered when a row is selected
+| `on-page-change` | function | & | no | n/a | n/a | triggered when pagination is changed
`columns-parameters` is an array describing all basic parameters of each column.
diff --git a/packages/oui-datagrid/src/datagrid.controller.js b/packages/oui-datagrid/src/datagrid.controller.js
index c344bd78..295e6d17 100644
--- a/packages/oui-datagrid/src/datagrid.controller.js
+++ b/packages/oui-datagrid/src/datagrid.controller.js
@@ -246,25 +246,23 @@ export default class DatagridController {
this.refreshData(() => {
this.paging.setOffset(1);
this.paging.setCriteria(criteria);
- }, false, false);
+ }, false);
}
- onPaginationChange ($event) {
+ onPaginationChange ({ offset, pageSize }) {
this.refreshData(() => {
- this.paging.setOffset($event.offset);
- this.paging.setPageSize($event.pageSize);
- }, true, true);
- }
-
- scrollToTop () {
- // Small delay otherwise rows could not be rendered
- // yet and position would be wrong
- this.$timeout(() => {
- this.$element[0].scrollIntoView(true);
- });
+ this.paging.setOffset(offset);
+ this.paging.setPageSize(pageSize);
+ this.onPageChange({
+ $pagination: {
+ offset,
+ pageSize
+ }
+ });
+ }, true);
}
- refreshData (callback, skipSortAndFilter, requireScrollToTop, hideLoader, forceLoadRows) {
+ refreshData (callback, skipSortAndFilter, hideLoader, forceLoadRows) {
if (this.loading) {
return this.$q.when();
}
@@ -281,13 +279,11 @@ export default class DatagridController {
.then(() => this.paging.loadData(skipSortAndFilter, forceLoadRows))
.then(result => {
this.displayedRows = result.data;
- if (requireScrollToTop) {
- this.scrollToTop();
- }
if (this.hasActionMenu) {
setTimeout(() => this.checkScroll(), checkScrollOnRefreshDataDelay);
}
})
+ .catch(error => console.log(error))
.finally(() => {
this.loading = false;
this.firstLoading = false;
diff --git a/packages/oui-datagrid/src/datagrid.directive.js b/packages/oui-datagrid/src/datagrid.directive.js
index 7ad9c7b1..c4c5caf0 100644
--- a/packages/oui-datagrid/src/datagrid.directive.js
+++ b/packages/oui-datagrid/src/datagrid.directive.js
@@ -18,7 +18,8 @@ export default () => {
rowLoader: "&?",
emptyPlaceholder: "@?",
onColumnsParametersChange: "&",
- onRowSelect: "&"
+ onRowSelect: "&",
+ onPageChange: "&"
},
compile: elm => {
// Transclude can't be used here otherwise transcluded
diff --git a/packages/oui-datagrid/src/datagrid.service.js b/packages/oui-datagrid/src/datagrid.service.js
index bf7e74ca..dcaec6ae 100644
--- a/packages/oui-datagrid/src/datagrid.service.js
+++ b/packages/oui-datagrid/src/datagrid.service.js
@@ -28,7 +28,7 @@ export default class DatagridService {
const datagridController = this.datagrids[datagridId];
if (datagridController) {
- datagridController.refreshData(false, false, false, !showSpinner, true);
+ datagridController.refreshData(false, false, !showSpinner, true);
}
}
}
diff --git a/packages/oui-datagrid/src/index.spec.js b/packages/oui-datagrid/src/index.spec.js
index 06b433c2..95037206 100644
--- a/packages/oui-datagrid/src/index.spec.js
+++ b/packages/oui-datagrid/src/index.spec.js
@@ -1270,6 +1270,24 @@ describe("ouiDatagrid", () => {
expect(getCell($secondRow, 1).children().html()).toBe(fakeData[3].lastName);
});
+ it("should execute callback when pagination changes", () => {
+ const onPageChangeSpy = jasmine.createSpy("onPaginationChangeSpy");
+ const element = TestUtils.compileTemplate(`
+
+
+
+
+ `, {
+ rows: fakeData.slice(0, 5),
+ onPageChange: onPageChangeSpy
+ }
+ );
+
+ getNextPagePaginationButton(element).triggerHandler("click");
+
+ expect(onPageChangeSpy).toHaveBeenCalled();
+ });
+
it("should support action-menu as column", () => {
const element = TestUtils.compileTemplate(`