How to handle multiple statuses when tagging items

by Corey   Last Updated September 10, 2019 01:16 AM

Currently working on the 'tagging' functionality for a page of results.

  • User needs the ability to tag and untag results
  • Page may have active filers that exclude results based on tags

What pattern can I employ that will allow the user to manipulate a group of selected items that have a mix of tags (out of 5 items, maybe only 3 have "Tag 2" for example).

Ideas I have explored:

Simple dropdown A simple dropdown that lists all the available tags, if the items are marked with a tag, the dropdown listing would reveal as "untag" when hovered. This idea break as soon as you have a selection of items that don't all have the same tags.

Checkbox and indeterminate state A list of checkboxes in a dropdown showing all the available tags, if a tag has mixed selections it would show as an indeterminate state. User can check or uncheck desired tags and apply as a single function.

Dropdowns Two separate drop-down buttons, one for "Tag" and another for "Untag". User can make selections and add or remove tags as they wish. The dropdown menu items are not affected in any way by the items that are selected. This option breaks down once you consider the 'exclude' filters. If the first action I was to take causes the copies to be removed from view, I am unable to take the second action.

Dropdown with indeterminate state This would be a simple dropdown but with indetermintate states. If a dropdown menu item has mixed states it doesn't show "untag" on hover, the user only has access to "untag" hover if all selections have that tag.

My preference is for the checkbox option but looking for addition opinions or thoughts on my approach.


default opened

Tags : usability tags

Related Questions

Updated May 16, 2017 15:16 PM

Updated April 22, 2016 08:06 AM

Updated August 30, 2017 13:16 PM

Updated July 31, 2018 14:16 PM

Updated June 11, 2016 08:06 AM