Skip to content

Wdfn 556 click on page number scrolls to top

Before making a pull request

  • Run all linters (make lint)
  • Run all tests (make test)
  • Update the changelog appropriately

Description - WDFN-556 - Click on Hydrograph Data Table Pagination Number Scrolls Page to Top

This is a issue in the List.js package and therefore isn't easy for us to fix. I did look through the List.js repository and didn't find any issues related to this problem.

The fix here works in 95% of the cases and stops the page moving to the top by locking the viewpoint of the page where it was when the pagination button was clicked. So for every page in the table, except the last one, this works perfectly. On the last page since the number of rows in the table is often much less than that of previous pages, it makes the page shorter. Since the viewpoint is fixed the page moves upward under the viewpoint sometimes causing the table to vanish from view.

So this is not a perfect solution, but it is much better than what it was. And the new behavior is something that could logically be expected.

With more work, it might be possible to tie the viewpoint to an element, such as the last row in the table, so that when the number of table rows changed, the viewpoint would move with it. I experimented with this a bit, and found some challenges, one, .focus(), when used on any of the table elements, even the anchor element in the pagination, would not change the viewpoint. Second since the page refreshes, we lose reference the element we would like to keep in view.

All in all, fixing this last pagination link seems like a challenge, and since we are considering moving to new tables (that are mobile friendly), the new implementation used may render this issue moot and so spending more time here may not be the best use of our resources.

After making a pull request

  • If appropriate, put the link to the PR in the JIRA ticket
  • Assign someone to review unless the change is trivial

Merge request reports

Loading