Pager Options for Table Perspective to show ALL data

Hello everyone!

Is there any way of having an option that shows all the data in a perspective table?
Our current approach is 1000 as a starting option.

Thanks in advance!

Try
pager.top : false
pager.bottom : false

2 Likes

I haven't done it yet, but I'm wanting to implement the ability for the user to pick from either a specific number of rows, or showing all of them, which doesn't exist when using the pager. My plan is to embed the table in a Coordinate container so that I can overlay my own dropdown of options bound to the value of pager.activeOption.

(Only very recently did they deprecate the pager.initialOption in favor of a new pager.activeOption that plays well with bindings, so my users can finally rely on their selection sticking the next time they view a table.)

I think I would skip the coordinate container and overlay and just add a "Show All" checkbox above the table.

  • Make a bidirectional property binding from that to a view property custom.tableShowAll.
  • Bind pager.bottom to the custom property using an expression binding, !{view.custom.tableShowAll}. (Note the ! NOT operator at the start of the expression.)
1 Like

I try to avoid using extra screen real estate if I don't have to, and most of my tables already have overlays on top of the pager bar for things like "Export to Excel" buttons. But your solution is certainly easier to implement, and would collapse the entire pager bar, making extra space for the rows. I would recommend using toggle buttons over single checkboxes.

1 Like

This is one instance where I would add the table to a flex and add your other components into the flex with style.position: absolute and then set the position of it in styles. Otherwise your components will be at the mercy of coord sizing and will likely end up covering things or being overly tiny or large at other resolutions

Eg

2 Likes

The way I do it does allow for varying screen sizes. I set the coordinate container to percentage, then place a flex container at 0, 0 that spans 100% of its width. I make it only a couple pixels tall so it doesn't overlap the table's navigation, set its overflow to "visible" and then that way I can place components in it at a position relative to the right side of the table (I suppress the "Jump to" input with CSS).