Selected items must remain visible when the control is collapsed
Aliases: selected chips · collapsed trigger · multi-select echo
What it is
After a multi-select dropdown closes, the items that were chosen must still be readable. A blank trigger or “please choose” is not enough. Collapsed selection visibility means names, chips, or a summary that can still point at concrete objects. A single select can expose one value; a multi-select that only says “selected” leaves checking, forwarding, and assistive selected-lists hollow. What must be visible are the objects, not the mere fact that something is inside.
Why it happens
Once the list is gone, working memory will not hold the string of names just ticked. People scan the trigger as the answer itself; a placeholder there makes the answer perceptually unfilled. The cost of reopening to check deters checking, so wrong and missing members ride to submit. Several names also have membership: one name missing or extra cannot be seen in “4 selected.”
Chips make each chosen object a removable entity, more resistant to truncation than a comma string: a missing chip is a missing item. Comma-separated text on a narrow width cuts at an arbitrary point, often mid-name, and membership boundaries vanish.
Where it stops holding
When the selection is huge, the trigger cannot hold every name and a summary-plus-count must take over — that is the next rule, not an excuse to default a small selection to a number. After filtering, items absent from the current filter still belong on the trigger, or collapsed visibility will flicker with the keyword. A read-only echo should lose the chevron so it does not look editable. If an object’s display name can change (someone renamed a tag), the collapsed state must follow the data, not cache a stale string.
Applying it
- List short names or chips of chosen objects on the closed trigger; show a placeholder only when empty.
- When names overflow, keep a recognisable head of the list rather than replacing everything with a hollow phrase.
- Each chip should identify one object; do not fuse three names into an unsplittable clause.
- How to check: pick two or three, close the panel, show the screen to someone who never saw it open, and ask “who is selected.” If they cannot name them, the collapsed state is not carrying the choice.