Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: DataTable Pagination

acasner priority asked 1 year ago


I am attempting to load the current state of a DataTable Pagination. I am able to use the Pagination Event Emitter to know what page the current data table is on. However when I pass it via the queryString parameters in angular I am unable to set the current active page after the async data is loaded into the data table.

How would I go about doing this? Here I have the event emitter to route the current page.

onPaginationChange(event: MdbPaginationChange): void { this.router.navigate(['/data'], { queryParams: { pg: event.page }}) }

Attempting to access the Pagination component and set the page after the data has been loaded gives me no luck.

@ViewChild(MdbTablePaginationComponent, { static: true }) mdbPagination!: MdbTablePaginationComponent;
// after data is loaded
this.mdbPagination.page(qsp.pg); // No luck

Any help would be greatly appreciated.



I think there is a problem with the code syntax. In this case, you need to just set the new page value like this:

this.mdbPagination.page = newPageNumber;

acasner priority commented 1 year ago

Thank you! Do you happen to have some more detailed documentation around Data Tables other than this page: https://mdbootstrap.com/docs/angular/data/datatables/#docsTabsAPI ?


Arkadiusz Idzikowski staff commented 1 year ago

All available information about this component can be found on the page you provided. Please let us know if you have any suggestions on how we can improve the documentation.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: MDB5 4.0.0
  • Device: Laptop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No