Panel: List of Pages, Filter by user input

Kirby 4
1

Hi all!

I tried searching for it, but came short on the solution and don’t really know which way would be the best way to implement this?

I have several articles of furniture (each is saved as a page), which all have several attributes (name, make, model, year etc)

Using type: pages and layout: table I can see a pretty list of all the furnitures and their attributes, but I would now like to be able to filter those by eg year, or model (which would be tags or structure et al)

Using query: pages this is doable, but I don’t want to have it “hardcoded” in the blueprint, but would rather want the user to be able to select (one or more) filters and the list will be filtered accordingly? While there is a search function option (search: true), it does not really work in my use case?

So to summarise: can this be done in k4 with existing tools? If not, what would be your suggestion to implement this? Dynamic blueprint? Plugin? Field Method? Panel area?

One other way which I came up with, would be to do this in the frontend and then link back to the panel to edit a furniture - doable, but I wouldn’t want to switch “frontends”

Thanks!

2

In what way does search not work?

3

as far as I understand, it is a full text search, so I can’t search (or filter) for e.g. tags consistently: if the tag is “chair” but another item has “chair” in the title (but a different tag), both get shown (which is perfectly correct, just not for my use case: filter by tag “chair”, and by category “modern”, etc.; or whatever)

4

In that case, you would need multiple filters, and therefore a custom solution

5

I thought as much :confused: thanks!

Any hints you can give me on which way might be the most straight forward one?

6

Hey @gork
have you read this article in the docs?

1 Like
7

Hi Luca

Thank you! I have not looked into this, but as far as I can understand (maybe I am wrong), this will make it possible for me to better refine the “global” panel search?

Maybe I am not able to express myself clearly enough: what I in essence want is something like this (jQuery tablesorter 2.0 - Custom Filter Widget Functions) but for pages?
Search within columns / filter by attributes etc?

8

As I wrote above, you would need a custom pages section that implements some sort of sortable/filterable table (only a Vue variant instead of jQuery).

Not aware of any existing plugin that brings this sort of functionality.

9

I probably didn’t read your initial post closely enough.

If your not an expert in Kirby and Vue (like me), maybe this cookbook article is helpful. There Sonja and Bastian describe how to implement a sortable table of products in it’s own view. Maybe you can go from there and make the table not sortable, but searchable?

A problem might be, that if you have a large number of pages to search and the list is paginated, this approach will only work for the currently shown pages.

So if you have a large number of pages to search (by tag), maybe adding a custom kirby-wide search is the better option. Also described in the same cookbook, here.

1 Like
10

oki! thank you all for your suggestions!
I’ll have a look at your link @luca regarding the Advanced Panel area!