UIPaging Multi-instance Query-preserving

Paginatie Voorbeeld

Render multiple UIPaging widgets on the same page with independent prefix and otherQuery so each pager preserves the others' state.

Pagers
3
Records
2,500
Styles
3

Pager A — default width

1,000 records · 10 per page · prefix page_a

total 1000 page-size 10

Pager B — wide side

500 records · 10 per page · widthSide: 5 · prefix page_b

total 500 side 5

Pager C — large page size

1,000 records · 100 per page · prefix page_c

total 1000 page-size 100

How it works

Each pager owns its own query parameter prefix

prefix

Sets the query key — e.g. ?page_a=2. Lets several pagers coexist independently.

otherQuery

Forward the other pagers' current page so clicking one pager doesn't reset the others.

widthSide

Number of page links on each side of the current page. Larger values produce wider button strips.

File References

Where this example lives

  • View
    example/lib/widgets/example/pagination.j2.html
  • Controller
    example/lib/controllers/home_controller.dart → paginationExample()
  • Paging widget
    example/lib/widgets/template/paging.j2.html