web-dev-qa-db-fra.com

Commutateur booléen avec un troisième état

Remarque: tout le monde semble avoir mal compris cette question. Littéralement, tout le monde. Je ne crée pas de formulaire d'inscription, je ne collecte pas de données personnelles. La forme dont il s'agit est utilisée pour filtrer une grande liste de personnes par certaines conditions.

J'ai un formulaire de création de requête qui aide l'utilisateur à créer une requête SQL. Toutes les variantes possibles de la requête sont répertoriées et l'utilisateur doit choisir les variantes requises et exécuter la requête.

Problème

Pour un individu, l'utilisateur peut choisir le Genre. De l'extérieur, cela ressemble à une opération booléenne (masculine ou féminine), mais il a une autre variante.

  1. L'individu est [~ # ~] homme [~ # ~]
  2. L'individu est [~ # ~] femme [~ # ~]
  3. Le sexe de l'individu ne doit pas être pris en compte (peut être [~ # ~] masculin [~ # ~] ou [~ # ~] femme [~ # ~] )

J'ai remplacé boutons radio par un Switch comme ceci:

Screenshot of widget

Comment représenter le 3e état?

62
Shreyas Tripathy

Si j'ai bien compris les prémisses de la question, ce que l'utilisateur doit décider est:

  1. Si l'utilisateur souhaite considérer (filtrer par) l'une des options suivantes
  2. Si la réponse à 1 est Oui, choisissez l'une des options

Les résultats possibles sont:

  • Option A
  • Option B
  • N'est pas applicable

Proposition originale : [démo]

Étant donné que vous utilisez boutons à bascule , pour le troisième résultat, vous pouvez donner la possibilité de désélectionner les deux options (en ajoutant une note supplémentaire pour clarifier cette possibilité ou un "(facultatif)" à côté de l'étiquette). Un ou plusieurs boutons peuvent être sélectionnés. Cliquer sur un bouton déjà sélectionné le désélectionne.

Deuxième proposition : Laissez l'utilisateur décider 1 puis 2. La case à cocher active/désactive les boutons. Dans ce cas, les boutons à bascule peuvent agir comme des boutons radio là où l'un doit être sélectionné.

(Merci @theonlygusti pour les commentaires sur le libellé de la case à cocher)

81
Alvaro

Ici:

Vous créez un filtre de recherche? Ajoutez simplement une option qui signifie que vous ne vous souciez pas de cette option de filtre.

mâle | femme | n'a pas d'importance

Autres noms:

  • Tout
  • Soit
  • Toutes les personnes
  • N/A (sans objet)

J'aime "tout" le plus.


L'OP a exprimé (dans les commentaires sur cette réponse) la crainte que cette solution n'oblige l'utilisateur à faire des clics supplémentaires. Cependant, comme le dit IMSoP:

Si la valeur par défaut est "Any", cette option doit être sélectionnée par défaut.

Ayez juste une option sélectionnée par défaut.

115
theonlygusti

Ce que vous recherchez est "les deux", "tout" ou "tous" (au cas où vous ajouteriez plus de catégories de sexe).

Tout - Femme - Homme

Cela montre donc clairement que les résultats des deux sexes (ou de tous) seront inclus. Et de cette façon, l'utilisateur doit choisir l'une des trois bascules, éventuellement "Tous" serait sélectionné par défaut.

28
Luciano

Dans de nombreuses situations, le contexte est vraiment très important, et il peut être judicieux de rechercher une manière cohérente de faire tous les filtres, et pas seulement celui des hommes/femmes. Comme l'indique la question:

La forme dont il s'agit est utilisée pour filtrer une grande liste de personnes par certaines conditions.

Quelles sont les autres "conditions" et comment se combinent-elles? Comprennent-ils des passe-temps? pays/région/ville de résidence? département? Nombre d'années de service? Avec ou sans options multiples/imbriquées pour filtrer?

Comme alternative, il pourrait être intéressant de voir comment fonctionnent les filtres "typiques" dans les environnements de commerce électronique:

enter image description here

  • si rien n'est sélectionné, aucun filtre à cette condition n'est appliqué
  • si un (ou plusieurs) est sélectionné, alors seuls les enregistrements avec cette condition sont affichés
  • si toutes les options sont sélectionnées, tous les éléments avec ces options sont affichés ( note: si un élément n'a pas d'option, l'élément n'est pas affiché , donc dans l'exemple masculin/féminin, si l'utilisateur sélectionne des options masculines et féminines, seules les personnes dont le sexe est renseigné sont affichées)
12
wintvelt

Que diriez-vous d'ajouter un troisième bouton radio pour le troisième état ?

enter image description here

12
DPS

Pour une sélection qui comprend "aucun choix", ainsi que d'autres choix exclusifs, une bonne boîte de sélection à l'ancienne est géniale! Dans ce cas spécifique, cela vous permettrait d'avoir une valeur par défaut de "Ne pas filtrer", plus autant d'autres options que vous en avez besoin, comme ceci (montrant l'état fermé, plus les options lorsqu'elles sont ouvertes):

Select showing non-binary options

Il a également pour effet secondaire de Nice d'être trié par ordre alphabétique, de sorte que vous pouvez contourner toutes les considérations politiques de l'option à privilégier!

9
Beejamin

Comme d'autres l'ont suggéré, offrez des hommes ou des femmes ainsi que d'autres, non spécifiés (ou n'importe quel nombre d'options en fonction des données collectées).

Mais votre question est vraiment de savoir comment éliminer le champ entier qui devrait être soit une case à cocher indiquant qu'il fait partie de la requête/résultats (exemple d'image ci-dessous) OR vous devez ajouter/supprimer/réorganiser les champs à partir d'une liste.

La deuxième option fonctionne mieux s'il existe de nombreux champs à choisir. La première option est plus facile pour l'utilisateur.

Exemple de case à cocher:

Gender Selection

8
Graeme Wicksted

Je dirais qu'une liste déroulante est le meilleur objet d'interface utilisateur pour cette situation.

mockup

télécharger la source bmml - Wireframes créés avec Balsamiq Mockups

Il est probablement plus familier aux utilisateurs, plus facile à dire en un coup d'œil, et trivial pour revenir à l'état "tout". De plus, il est extensible, si vous voulez ajouter "transgenre", par exemple. Le seul inconvénient potentiel est que les autres options ne sont pas présentées à l'utilisateur sans interaction.

(En supposant que les données source ne sont pas de forme libre. Si c'est le cas, alors une zone de liste modifiable peut être la meilleure, mais pas la plus intuitive.)

7
wmassingham

Sur la base de toutes les informations supplémentaires dans les commentaires jusqu'à présent, je suggère d'ajouter un bouton de réinitialisation. Il fournit l'état "non défini" souhaité et ne laisse pas les utilisateurs deviner comment le désactiver.

enter image description here

7
jazZRo

Si vous souhaitez que certaines options de filtre puissent être ajoutées ou supprimées dans la requête, envisagez une approche dans laquelle tous les filtres actifs sont représentés sous la forme de cases sur une ligne distincte à la fin, et peuvent être supprimés individuellement pour désactiver le filtre (généralement avec un petit X à la fin). Cela est similaire à la façon dont plusieurs destinataires sont spécifiés dans la plupart des applications de messagerie et de SMS. Gardez à l'esprit que cela peut ne pas avoir de sens si toutes les autres options de filtre sont obligatoires (je devrais en savoir plus sur le fonctionnement de votre générateur de requêtes pour savoir si l'ajout de `` filtres en boîte '' au modèle mental de l'utilisateur en vaut la peine).

4
Martin Gjaldbaek

Je suis d'accord avec quelques autres réponses: il semble que vous ayez besoin d'une troisième option, "peu importe". Vous pouvez considérer les formulations suivantes:

  • n'a pas d'importance
  • tout
  • pas important

Certes, ce ne sont PAS ok:

  • autre (il ne s'agit pas de choisir des articles qui ne sont ni M ni F)
  • les deux (pas bon si vous voulez que ces cas "peu importe" apparaissent partout: vous ne pouvez pas dire "A, B, C, D, les deux")
  • aucune de ces réponses (identique à "autre")
  • tous (peut-être bien, mais je préfère aller avec "n'importe lequel" ou "n'importe lequel d'entre eux")

En tant que préoccupation secondaire, le cas spécifique du genre a toute une série d'implications, que d'autres ont si vaillamment défendues (même si elles ont largement manqué le point de votre question). Le genre semble être un sujet très sensible: utilisez peut-être la prochaine fois un autre exemple :)

4
Simone

Meilleure solution: vous pouvez utiliser le commutateur tristate de jQuery. https://vanderlee.github.io/tristate/enter image description here

<input type="checkbox" class="tristate" value="1">
<input type="checkbox" class="tristate" value="1" checked="checked">
<input type="checkbox" class="tristate" value="1" indeterminate="1">

Les commutateurs booléens sont conçus pour n'avoir que deux états.

Si vous avez besoin d'un "troisième" état, vous devez utiliser autre chose. Boutons radio, diapositives, listes déroulantes. Si vous filtrez, j'utiliserais un commutateur pour chaque catégorie (pas trois états). Parce que, vous avez 4 combinaisons de recherche possibles

Male   filter [ ON | OFF  ]
Female filter [ ON | OFF  ]
3
Jose Berengueres

Toutes les variations possibles de la requête sont répertoriées et l'utilisateur doit choisir les variations requises

Je dirais que cela répond à votre question. Vous ne devez pas traiter le champ de genre comme une valeur booléenne, mais comme une valeur d'énumération, ce qui, dans votre cas, ne prend en charge que 2 valeurs différentes.

En ce sens, affichez simplement une sélection comme vous le feriez pour toute autre énumération:

  • Soit une seule sélection ou une liste déroulante avec les options (Tout, A, B, C);
  • Ou, une sélection multiple ou une série de cases à cocher avec chaque option et les actions habituelles (sélectionner tout/ne rien sélectionner) à côté.
1
njzk2

Il s'agit d'une situation où il y a deux choix, mais vous pouvez le considérer comme un cas spécifique d'une situation où il y a N choix. Je demanderais alors comment créer un filtre avec N choix, puis appliquer N = 2.

L'avantage de cette approche est que si vous souhaitez ou devez inclure d'autres genres, vous n'avez pas à modifier votre allocation de filtre. En outre, il offre une plus grande cohérence avec d'autres filtres qui ont N choix.

Que diriez-vous juste d'une liste de cases à cocher?

Filter by gender:

[x] Male
[x] Female

Ils peuvent être tous les deux allumés, ou l'un d'eux peut être allumé. L'application doit s'assurer que vous ne pouvez pas décocher la dernière option, car cela entraînerait une situation où tous les éléments sont filtrés.

Si jamais vous avez besoin de l'étendre plus tard:

Filter by gender:

[ ] Male
[x] Female
[x] Other
[x] Not specified

Le seul inconvénient est qu'il peut nécessiter plus d'espace. En règle générale, je vous conseille de placer vos filtres dans une colonne plutôt que dans une rangée.

1
Joost Lubach

L'alternative peu encombrante: deux boutons, "Homme" et "Femme", et au plus un peuvent être mis en évidence.

C'est un filtre. Les filtres suppriment les données d'un ensemble de données. Sélectionnez "Homme" et seuls les enregistrements marqués comme "Homme" sont utilisés. Sélectionnez "Femme" et seuls les enregistrements marqués comme "Femme" sont utilisés. Sélectionnez aucun et tous les enregistrements sont utilisés. Rien de sélectionné n'est l'état par défaut. Si l'utilisateur choisit par exemple "Homme" et change d'avis pour n'en sélectionner aucun, un autre clic sur "Homme" le désactive.

Certaines personnes semblent avoir une fixation sur les personnes qui ne tombent pas ou ne veulent pas entrer dans ces catégories, ou ne veulent pas dire leur sexe. Ces personnes seront évidemment dans la liste si vous ne choisissez rien. Et c'est vrai, donc - je ne voudrais pas que Dick, Tom et Harry puissent trouver une liste complète de tous les employés transgenres (qui sont probablement très peu), car il est peu probable qu'ils conduisent au harcèlement ou à la discrimination s'ils sont faciles à repérer dans une grande population.

1
gnasher729

Une autre façon de le considérer est d'avoir deux boutons à bascule, c'est-à-dire de filtrer en utilisant ce que l'utilisateur a sélectionné. S'ils ne sélectionnent pas non plus, ne l'incluez pas dans la requête. Si l'un d'eux ou les deux, ajoutez la clause where ... et le genre = 'male' ..., ou ajoutez la clause where ... and (gender = 'male' ou gender = 'female') ).

Si le sexe est toujours présent, cela produira les mêmes résultats si aucun sexe n'est sélectionné dans l'interface utilisateur ou les deux sont sélectionnés.

Si le sexe est nullable, vous souhaiterez peut-être ajouter null comme élément sélectionnable: [NULL] [MALE] [FEMALE]

Pour moi, cela dépend vraiment du contexte de l'interface utilisateur, que je sélectionne la case à cocher activant le champ ou que je liste simplement les options d'un champ particulier.

0
Robert Baron

qu'en est-il de cette approche compacte pour une entrée de filtre oui/non/ni

prendre un repère à partir des boutons de tri dans les en-têtes de colonne qui basculent de off/up/down/off par clic

un bouton qui modifie les valeurs par clic, montrant la sélection de filtre actuelle:

--------------------
| filter by gender |    (gender filter is off)
--------------------

(Cliquez sur)

--------------------
|      female      |    (female filter is on)
--------------------

(Cliquez sur)

--------------------
|       male       |    (male filter is on)
--------------------

(Cliquez sur)

--------------------
| filter by gender |    (gender filter is off)
--------------------

les boutons "femelle" et "mâle" peuvent être inversés pour indiquer que le filtre donné est "activé"

0
stuart

Boolean n'a que deux états; marche/arrêt ou un/zéro. D'un autre côté, s'il se trouve dans une base de données, il peut être nul et non défini. Utilisez donc zéro, un ou nul pour les hommes, les femmes et les autres. Trois états dans un champ booléen.

0
Simon

Il vaut mieux avoir deux champs oui/non plutôt que des boutons radio. Il peut toujours ressembler exactement à ce que vous avez, mais il autorise les 4 états, y compris les deux activés et désactivés. Pour accentuer son allumage/extinction, vous pouvez ajouter un petit interrupteur marche/arrêt qui bascule à chaque sexe.

0
samerivertwice

J'utiliserais des cases à cocher, donc vous cochez celles que vous souhaitez prendre en compte pour la recherche, car en gros vous avez "Rechercher les hommes"/"Rechercher les femmes"/"Rechercher les deux"

Un avantage secondaire est que si votre système se développe pour inclure d'autres genres, vous ajoutez simplement de nouvelles cases à cocher

0
deworde