Pagination [entriesOption] default value


Topic: Pagination [entriesOption] default value

Dave Moniz pro premium priority asked 7 months ago

Expected behavior

Using the entriesOptions input I can set the rows per page options and the first value of the supplied array would be taken (AND USED) as the default setting

Actual behavior

It takes the array no problem but the default value is empty until I select it

Resources (screenshots, code snippets etc.)

I can provide a working example as proof


Arkadiusz Idzikowski staff commented 7 months ago

@Dave Moniz Thank you for reporting this problem, we will take a closer look at that and add a fix as soon as possible.


Dave Moniz pro premium priority commented 7 months ago

I noticed it work fine with any number of entries - as long as your first option is 10. It is only when you change the first option from 10 that it becomes a problem.

Additionally is there any way to have an 'ALL' option implemented?

For example: [10, 25, 50, 100, 'ALL'] where all gets all regardless how many.


Arkadiusz Idzikowski staff commented 7 months ago

@Dave Moniz Thank you for the additional information.

We did not plan to add such a feature to this component but it looks interesting. We will discuss it with our team.


Arkadiusz Idzikowski staff answered 6 months ago

@Dave Moniz In the pagination component we have two inputs: entries responsible for number of displayed items (10 is default) and entriesOptions that specifies possible options. We need to use the entries variable as a single source of truth for a number of displayed items.

If you want to change the options list and update the number of displayed items at the same time, you need to update the entries input as well. Otherwise the component will automatically add a current number of entries to the entriesOptions list.

HTML:

<mdb-table-pagination #pagination [entries]="entries" [entriesOptions]="entriesOptions"></mdb-table-pagination>

TS:

  entries = 10;
  entriesOptions = [10, 25, 50, 100];

  ngOnInit(): void {
    setTimeout(() => {
      this.entries = 5;
      this.entriesOptions = [5];
    }, 2000);
  }

We updated the Datatable documentation page and added all required information about every data table component and directive. I hope the component will be easier to use now.

Please let us know if that information helped you to resolve the problems.


Dave Moniz pro premium priority commented 5 months ago

Perfect! Thank you!

However I never received a notification that you left this post. I've noticed I haven't received a lot of notifications recently actually :(


Dave Moniz pro premium priority answered 6 months ago

This was incorrectly reported as fixed in MDB5 1.0.0-beta8.

When I pass: [entriesOptions]="[5]" 5 should be the default option and the only option. However the available options are 5 and 10 - with 10 being the default - even though it wasn't even passed.

This is almost worse than it was before the "fix"


Grzegorz Bujański staff commented 6 months ago

We will check it again and fix it.


Dave Moniz pro premium priority answered 5 months ago

Can confirm this is resolved now as of MDB5 1.0.0. Documentation is updated, but there's a small typo: The default value for dataSource has been displayed as []]

Closing now.


Status

Closed

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: MDB5 1.0.0-beta5
  • Device: PC
  • Browser: Google Chrome
  • OS: Arch Linux
  • Provided sample code: No
  • Provided link: No