web-dev-qa-db-fra.com

Case à cocher ajoutée et ajoutée: quand puis-je l'utiliser?

A jetait un oeil à Twitter Bootstrap , et, en regardant les cases à cocher pré-ajoutées et ajoutées, je n'arrive pas à comprendre où, pourquoi et quand je peux l'utiliser.

Prepended and appended checkbox

Quelqu'un peut-il me donner un bon exemple?

16
caarlos0

en tant que créateur de Bootstrap, je peux peut-être éclairer ce sujet :). Les entrées ajoutées et ajoutées servent à deux fins:

  • Permettant la ponctuation simple ou les unités à associer à une entrée. Par exemple, si vous devez indiquer qu'un champ demande de l'argent, utilisez le préfixe avec un signe $. D'autres exemples incluent @ avec un nom d'utilisateur (à la page des paramètres de Twitter.com) et "+1" pour les entrées de numéro de téléphone.
  • Condenser une pratique courante pour basculer et modifier une valeur de formulaire. Dans certains cas, vous devrez peut-être activer un paramètre et lui fournir une valeur illimitée. —Ce contrôle personnalisé permet une manière plus compacte de le faire.

Les deux cas d'utilisation sont valides et sont survenus lors de la création de Bootstrap pour aider à repenser les outils internes de Twitter. Ce dernier, le basculement et la modification d'une valeur de formulaire, est issu d'une itération de notre tableau de bord Decider (Decider est un outil que nous utilisons pour activer et désactiver des fonctionnalités pour de petits groupes d'utilisateurs.) Nous avions besoin d'un moyen d'activer une fonctionnalité et de définir le% d'utilisateurs qui la verraient une fois activée. Comme nous avons tant de fonctionnalités que nous pouvons activer/désactiver, nous avions besoin d'une façon très condensée de le montrer.

Donc, c'est l'essentiel. Je ne l'utilise pas souvent moi-même, mais nous avons pensé que d'autres pourraient tomber sur ces deux mêmes cas d'utilisation. J'espère que cela pourra aider!

Soit dit en passant, n'hésitez pas à me contacter sur Twitter avec plus de questions sur Bootstrap au fur et à mesure qu'ils arrivent — @ mdo est ma poignée.

17
Mark Otto

Les cases à cocher prolongées ont du sens lorsque vous affichez une liste d'éléments qui doivent être vérifiés, ou lorsque vous voulez simplement vous en tenir à ce à quoi la plupart des gens sont déjà habitués. L'exemple ci-dessous (bien que pas génial) vous donne un exemple où je dirais qu'une case à cocher traditionnelle préfixée serait plus appropriée.

prepended checkbox example

La case à cocher jointe est plus pertinente lorsque le chèque fait partie d'un formulaire, en particulier dans les formulaires mobiles. Ici, vous voulez garder la partie texte en ligne avec les autres éléments du formulaire, et il est donc logique de l'utiliser. Vous pouvez voir un exemple de l'application d'évier de cuisine de Sencha Touch ci-dessous.

enter image description here

2
JohnGB

Deux utilisations logiques seraient la validation (ce qui en fait une case à cocher visuelle uniquement) et la création de cases à cocher créées par l'utilisateur.

Validation
Ceux-ci peuvent être utilisés pour montrer que le champ X est valide, par ex. cochez la case et donnez une petite teinte verte/bleue pour montrer "oui, ce champ est correct", et laissez-le vide et changez un élément en rouge et affichez un message d'erreur pertinent s'il ne vérifie pas. Ce ne serait pas un champ que l'utilisateur peut vérifier manuellement. Ceci est généralement géré par une image mais pas un champ de formulaire.

Cases à cocher créées par l'utilisateur
Springpad est un service qui inclut une fonctionnalité de liste de tâches qui utilise des cases à cocher pour permettre aux utilisateurs de créer une liste de contrôle et de marquer les éléments comme terminés à partir du même formulaire.

enter image description here

Google Tasks fait la même chose:

enter image description here

Le dernier champ est une entrée (tous le sont vraiment) et les cases à cocher marquent les éléments de votre liste comme "terminés".

2
Ben Brocka

Vous pouvez l'utiliser dans une "compétence" personnalisée comme une entrée. Vous devez donc saisir vos compétences, puis la case à cocher indique si vous souhaitez ou non que cette compétence apparaisse sur votre profil principal, ou simplement lorsque quelqu'un sélectionne afficher toutes les compétences.

L'utiliser comme bascule essentiellement pour le contenu d'entrée personnalisé. Dans cet exemple, vous utiliseriez l'ajout comme vous écririez le contenu, puis vous dicteriez qu'il existe davantage.

Le préfixe n'a aucun sens pour moi.

0
James Wilkinson

Après en cherchant sur Internet , je suis arrivé à la conclusion que la "case à cocher ajoutée" en tant que terme est principalement liée au cadre de Twitter Bootstrap. Il n'y a que 800 mentions et la plupart d'entre eux consistent à dépanner des demandes de scripts jQuery.

Ma seule idée logique est qu'il peut être utilisé comme sécurité intégrée pour les langues de droite à gauche au cas où changement de direction par défaut ne fonctionne pas correctement. Un tel contrôle n'a aucun sens pour les langues de gauche à droite, car l'utilisateur va remarquer un champ de texte, puis la case à cocher, ce qui déroutera l'utilisateur.

Si vous cherchez un moyen d'utiliser le contrôle car il est inclus dans le cadre, arrêtez-vous là. Le but d'une bonne UX est d'utiliser les éléments appropriés, donc quand un élément se sent inutile, il doit être ignoré/omis/abandonné/annihilé.

0
dnbrv