What control to use

Question

Hi all,

I have a list of devices that I need to filter on according to options selected by the user. One such option is cooling: when the user selects cooling only the devices with cooling are shown. If cooling is not selected then all devices (with or without cooling) are shown.

I wonder what kind of control I best use for this. My feeling is thata checkbox is not a good control since it represents:

No cooling (unchecked) / only cooling (checked)

while I want

cooling and no cooling (unchecked)/ only cooling (checked).

What control is best used here?

Thanks.

Answer 1

I see three options, in order of decreasing preference:

• Use a tristate checkbox (one that can be grayed), using the ThreeState property. The main advantage here is less clutter, less reading, and less clicks. If they are on gray at the beginning, it will be clear to the user that this state is possible and the deviation from usual checkbox behaviour should not be much of a problem.

• Use a drop-down list with options "Yes", "No" and "Don't care". If some or all of the options are going to be a definite "Yes" or "No" initially, this might be the better option.

• Use a grid of radio buttons with three columns. Ugly, and requires some thought to understand it. I would not do this.

Answer 2

Don't forget that a .NET checkbox class can be set to have three states

CheckBox.ThreeState = TRUE;

edit This gives you true or false for CheckBox.Checked and checked, unchecked or indeterminate for CheckBox.CheckState.

Answer 3

The checkbox is the correct control. You just have to label it correctly: “Include only devices: [ ] With cooling.” That seems unambiguous to me that uncheck means apply no filter and include both devices with and without cooling. In general, users interpret a blank, including unchecked, as “don’t query/filter on this criterion,” not as “invert this query filter criterion.”

If you’re not convinced, then use radio buttons (or a dropdown list if space is tight): “Include only devices: ( ) With cooling, ( ) With or without cooling.”

If you wanted to include the option to filter on Without Cooling, then you must use radio buttons or a dropdown list: “Include only devices: ( ) With cooling, ( ) Without cooling.” Likewise, if you need to show more than two states, you must use radio buttons or a dropdown list: “Include only devices: ( ) With cooling, ( ) Without cooling, ( ) With or without cooling.”

You are correct that using a tri-state checkbox would be confusing. The mixed state is used to mean “some yes, some no” not “both yes and no.” Windows UX Interaction Guidelines specifically prohibit using the mixed state of the checkbox as a third state for a single item (you filter, in this case), or letting users select a mixed state (pg49).

In general it should be avoided.