Looking for examples of buttons above a table that can show you the numbers of a specific type of item and when you click them filter the table.

Any link or example will help a lot.

I have looked for lots of examples. One example I found is here. Looking for similar examples, and too see if there are more complicated ones (filter based on more than one column).

enter image description here

  • Hi Zurim, have you tried searching online already? What did you like or not like about what you found? If you have more specific questions, we may be able to help you. – maxathousand Mar 19 '19 at 15:47
  • can you show us your efforts so far? This forum is most effective when people bring some mocks showing the specific situation, and outline any constraints they are dealing with. – Mike M Mar 19 '19 at 16:40

The most relatable example. Click on "Active" "Hot" etc and you know, the list is filtered. enter image description here

In your case, have an 'icon/name of the item + number of the specific item' in place of "Active","Hot".

  • This is an example of segmented controls. it works like tabs, meaning you cannot select/view more than one item at a time. – Sooraj MV Dec 16 '19 at 7:46
  • Yes that is correct. At the same time, the question doesn't seem to enquire for a need to see multiple filter results simultaneously. @Zurim just wants the numbers of results on each filter item. It is pretty simple to concatenate numbers at the end of the filter headers. Thanks – Kishan Dec 18 '19 at 3:12

Maybe you need something like datatables, it is jquery plugin.


From your description, I assume that you are looking for examples of Multi-Select Filter Tags. As usual just like any other component, there are many names for the same functionality. This is mostly used as additional filters by enterprise applications to filter large data grids. I'm attaching few links below for your reference.

Not the answer you're looking for? Browse other questions tagged or ask your own question.