Input select: Option list on top

Ask us anything How do I?
, ,
1

Hi there,

I have pagination in place with the option to define the number of records per page. I have placed this below of the table, at the bottom of the page. But when I want to select a different number of records to show, the dropdown goed below the screen and I need to scroll. How can I solve this?

image
image870×284 7.96 KB

In another (React) example I noticed different behaviour of the drop down based on scroll/page position.
image
And when this input select is at the bottom the dropdown moves to top.

image
image852×408 36.9 KB

Is this possible with Weweb? Should I use a different component maybe?

For now I will put de record number selector at the top of the table.

2

I succeeded by using the hover drop down menu element. The content sub-element can be positioned on top of the select field, using the absolute option.

In the content element I added 3 text elements (10, 25, 50) each triggering a workdlow on click that sets a limit variable, updates the limit of the paginator variable and sets the paginator back to page 1. Works like a charm.

1 Like
3

Ooooh nicely done! I don’t think I would have found a nice solution so quickly!

Thanks so much for taking the time to share it with us :grinning:

1 Like