Custom arrows to select next row in table

App Building
1

Hi i got the following case

image
image1207×687 111 KB

i got two arrows to navigate a hidden table in the bottom, what happens if the table got pagination, and i click next button, it will automatically go to the next page? how i do that?

image
image899×686 57.8 KB

right now, when i click the last row it goes back to the beginning, any way to make to go next page results, automatically?

thank you

2

You can create JS query that would additionally set next page when the current line reaches the bottom. This JS script may look like this:

if ((table2.selectedDataIndex + 1) % table2.pagination.pageSize === 0 ) {
  const currentPage = table2.pagination.currentPage
  table2.setPage(currentPage + 1)
}

table2.selectNextRow()

Note that % operator means 'what's left after division'. For example

20 % 10 = 0
21 % 10 = 1
etc.
Click to see animated GIF

CleanShot 2024-01-15 at 5 .36.48

1 Like
3

works for next row, but what about previous row if i want to go back?, also at start i have index set as NONE

image
image904×633 61.5 KB

4

Loom | Free Screen & Video Recording Software | Loom see whats happens as i have my index as none to start i have to click two times when im in another page

5

Hey @agaitan026 - I quickly tested the case when default row is set to None and can confirm it works. Your Loom video confirms negative so a wild guess could be something else interfering with that. I noticed query64.trigger() is set on change page event so I would ensure it does note interfere with that.

For the previous page logic, the logic would be similar. I beleive it is out of scope of this topic so feel free to create another topic for that. I will look into that when I have time.

In case you have budget I will be happy to help! Feel free to send me a private message then

2 Likes