How to allow user to sort a collection list in the front end?

I am following from here: https://learn.getgrav.org/content/collections

When you define a page you can say the default sort order. But is it possible to allow the user to sort this list from the front end? e.g., I have a table of data and I want to let the user sort on any field in ascending or descending order?

I do not see a built in way to do this, so I looked into doing this with twig. But I don’t see how you can grab $_GET parameters from twig.

Ideally I would like to select the field and sort order. How can I accomplish this with Grav, or does Grav not support the ability to send sort instructions? Javascript sorting is not desired because of pagination needs (I also can’t figure out how to get pagination to work, is it a built in option in the docs but requires a plugin to be installed?)

Pagination is usually done with the pagination plugin.

If you need front-end sorting, I wouldn’t use page collections, though theoretically you can put twig variables in the front matter. I just have never bothered. YMMV. You can access the request parameters with the “uri” variable, which gives you access to the URI API. Of specific note is uri.query(id).

For tables of data, JS sorting is certainly preferred by users. Otherwise they need to refresh the page, but that’s a UX decision you have to make. There’s at least one plugin that supports such table sorting: Tablesorter.

1 Like

Thanks, what I am trying right now is to create a custom template that needs this list, I then create the collection completely in the backend. The only issue I am having is sorting on date fields. I can sort on header.whatever but not header.startdate or similar.

I found that if I declare the collection in the yaml frontmatter for the page it is then already paginated when and you can only sort what is on the paginated screen instead of across all pages.