3

Below I have provided an example of a checkbox group including a parent checkbox in an indeterminate state. Some of the child nodes in the Tall Things tree are selected and some are not, therefore Tall Things is presented in an indeterminate state:

Indeterminate example

When the user clicks on the indeterminate checkbox, what should happen? Should the checkbox be checked, or should it be cleared? More importantly, why?

Improve this question
1
  • This does appear to be a duplicate, but I'm not sure how to proceed. My options are That solved my problem! or No, my question is different, but neither applies; the duplicate thread doesn't contain a solution either.
    – Daniel De Laney
    Mar 31, 2016 at 0:48

2 Answers 2

Reset to default
5

I've seen it as "Check All" (and a subsequent click would clear-all). I'd argue that there's a convention for check-all that makes most sense to most people, so the "best" would be to go that way.

Ultimately the two intuitive choices are Check Everything, and Uncheck Everything.

Which is better? Well I'm sure it can be argued both ways, but ultimately it's moot. The user can very quickly intuit either result, and what to do to achieve their desired goal.

Improve this answer
2
  • I'm hoping to find or establish a standard one way or the other, with a solid rationale behind it.
    – Daniel De Laney
    Mar 30, 2016 at 22:05
  • I think the answer is "check all" because a: there is convention behind it, and b: the average user probably jumps from "well I checked some of these, now I want all" more often than they jump to "well now I don't want ANY". That said, I don't think there's a perfect answer.
    – InfernalRapture
    Mar 30, 2016 at 22:07
1

This is a very common problem, and the way to display this is to use 3 states as follow:

  • checked (regular "tick" sign)
  • unchecked (empty box)
  • partially checked (a tick with some different approach, usually a grayed out box or a different opacity or a color difference)

You can see a live action example at Checkboxes

The rationale is really simple:

  • if ALL sub-items of the dropdown are selected , then the dropdown checkbox uses the checked status
  • if NONE of the sub-items of the dropdown are selected , then the dropdown checkbox uses the unchecked status
  • if SOME sub-items of the dropdown are selected , then the dropdown checkbox uses the partially checked status

Some visual samples:

enter image description here enter image description here enter image description here enter image description here

EDIT:

**When the user clicks on the indeterminate checkbox, what should happen? Should the checkbox be checked, or should it be cleared? **

Since this is a 3 state case, it should check/uncheck all, at demonstrated in the live example and graphical samples provided

More importantly, why?

Because of the partial statuses mentioned above, it goes both ways: a sub item affects the main tree branch (partial or total states), thus checking the main branch will affect ALL of the branches

Improve this answer
1
  • 5
    This doesn’t answer the question, it just reiterates the idea of an indeterminate state in the first place. The question (as I understand it) is specifically asking whether the first click on an indeterminate box should check all or should uncheck all, so you can't just say "it should check/uncheck all".
    – Alan Pierce
    May 18, 2017 at 18:31

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