Allowing users to select all items except few

Question

I have a list of country names (eg below)

I want the user to be able to either select a few countries or, select all countries except a few.

Now, this can be done using a select all button by selecting all items and then unchecking the ones that are not required. However, this creates a long query to be sent to the backend.

For example, if I want to select all countries except Argentina, the query would look something as follows:

select(Australia, Austria, Belgium...)

I want to transform this query to just

except(Argentina)  

How do I display/convey the user that he/she can either select countries that he wants details about or countries that he doesn't want details about?

Answer 1

First, you should try to avoid deciding how something should behave on-screen based on the technical constraint of what you send to the server. You can use JavaScript to reflect some modified version of the selection as hidden inputs for submission without it affecting the UI.

Having said that, I think this is a good candidate for the list builder UI pattern (also called a dual list), which would allow you to add or remove individual items to the selection. You could add buttons for "Add all" or "Remove all" too. I suspect that would be a more natural interaction:

^{Image credit: Microsoft Windows Design Guidelines for List Boxes}

Answer 2

From the user perspective the most easy way is an "inverted" selector. E.g. I know software where I check two boxes and than invert the selection before I press the "search" button. But this requires a certain level of instruction and abstraction by the user.

One possible solution to skip the "invert" step would be to provide two buttons:

• Search in all marked countries
• Search everywhere exept in marked countries

I think this is the most convenient one.