Passer au contenu
Français
  • Il n'y a aucune suggestion car le champ de recherche est vide.

Corfix Form Builder : utilisation du composant « Case à cocher »

Cet article vous explique comment utiliser le composant « Case à cocher » dans le générateur de modèles.

Le composant « Case à cocher » sert à effectuer des sélections simples de type « oui/non » ou « activé/désactivé ».


Où le trouver

Dans votre générateur de formulaires Corfix, cliquez sur un composant « Case à cocher » pour accéder au panneau de configuration. Vous verrez quatre onglets :

  • Affichage

  • Données

  • Validation

  • Conditionnel


1. Onglet Affichage

 

L'onglet « Affichage » permet de définir la manière dont la case à cocher s'affiche pour l'utilisateur.

  • Libellé :

    • Il s'agit du texte visible à côté de la case à cocher que les utilisateurs verront. Ce champ est obligatoire.

    • Exemple : « J'accepte les conditions », « Terminé », « Est-il actif ? ».

  • Largeur du libellé :

    • Permet de définir la largeur de l'étiquette située à côté de la case à cocher, en pourcentage.

  • Marge de l'étiquette :

    • Permet de définir l'espace entre l'étiquette et la case à cocher, en pourcentage.

  • Description :

    • Fournit un texte explicatif supplémentaire pour la case à cocher, généralement affiché en dessous de celle-ci.

    • Exemple : « Cochez cette case pour confirmer que vous avez bien compris. »

  • Info-bulle :

    • Texte qui s'affiche lorsque l'utilisateur passe la souris sur la case à cocher. Utile pour fournir une aide rapide ou du contexte.

  • Classe CSS personnalisée :

    • Permet aux utilisateurs avancés d’appliquer une mise en forme personnalisée à la case à cocher à l’aide de classes CSS.

  • Masquer le libellé :

    • Si cette option est cochée, le libellé de la case à cocher ne s’affichera pas (seule la case elle-même sera visible).

  • Modification dans une fenêtre modale :

    • (Les détails ne sont pas entièrement visibles sur la capture d'écran, mais cela concerne généralement la modification dans une fenêtre modale contextuelle).

  • Inclus dans les rapports :

    • Si cette case est cochée, les données de ce champ (coché/décoché) seront incluses dans les rapports.


2. Onglet « Données »

 

L'onglet « Données » permet de gérer les propriétés des données sous-jacentes de la case à cocher.

  • Valeur par défaut :

    • Si cette case est cochée, la case à cocher sera présélectionnée au chargement du formulaire. Les utilisateurs peuvent la décocher.


3. Onglet « Validation »

 

L'onglet « Validation » définit les règles applicables à la case à cocher.

  • Obligatoire :

    • Si cette case est cochée, l’utilisateur doit interagir avec la case à cocher. Cela signifie généralement qu’elle doit être cochée pour valider le formulaire, en particulier pour les cases à cocher de type « accord ».


4. Onglet « Conditionnel »

 

L'onglet « Conditionnel » vous permet de définir des règles déterminant quand ce composant « Case à cocher » doit s'afficher ou se masquer en fonction des valeurs d'autres composants du formulaire.

  • Simple :

    • Il s’agit généralement d’un bouton bascule ou d’un menu déroulant permettant de choisir entre une logique conditionnelle simple et une logique conditionnelle avancée.

  • Ce composant doit s'afficher :

    • Choisissez si le composant doit être « Affiché » ou « Masqué » (options implicites) en fonction de la condition.

  • Lorsque le composant du formulaire :

    • Sélectionnez un autre composant de votre formulaire dont la valeur déclenchera la condition.

  • A la valeur :

    • Précisez la valeur exacte que doit avoir le composant de formulaire sélectionné pour que la condition soit remplie.

    Exemple : vous pouvez configurer une règle pour que la case à cocher « J'accepte la politique de confidentialité » ne s'affiche que lorsque l'utilisateur sélectionne un pays spécifique dans un autre champ.


Fenêtre d’aperçu

La zone d’aperçu située à droite de la boîte de dialogue vous montre comment la « zone de texte » s’affichera visuellement sur votre formulaire. À mesure que vous modifiez des paramètres tels que le libellé, le texte de placeholder ou le nombre de lignes, vous verrez ces changements s’appliquer en temps réel.


Actions situées au bas de la boîte de dialogue :

  • Enregistrer : enregistre toutes les modifications apportées aux paramètres du composant « Case à cocher ».

  • Annuler : annule toutes les modifications non enregistrées et ferme la boîte de dialogue.

  • Supprimer : supprime le composant « Case à cocher » du formulaire.


Bonnes pratiques pour le composant « Case à cocher » :

  • Libellés clairs et orientés vers l’action : utilisez des libellés qui indiquent clairement ce que l’utilisateur accepte ou confirme (par exemple, « Cette tâche est-elle terminée ? », « Recevoir des mises à jour par e-mail »).

  • Utilisation pour les choix binaires : les cases à cocher conviennent particulièrement aux décisions simples de type oui/non, vrai/faux ou activé/désactivé. Ne les utilisez pas pour les options à choix multiples où une seule réponse peut être sélectionnée (utilisez plutôt des boutons radio ou une liste déroulante dans ce cas).

  • Définissez judicieusement la « valeur par défaut » : ne cochez d’avance la « valeur par défaut » que si la grande majorité des utilisateurs sélectionnera cette option, ou s’il s’agit d’un choix « d’adhésion » non critique. Évitez de cocher d’avance les cases relatives aux accords juridiques.

  • Rendez les cases à cocher « d’acceptation » obligatoires : si une case à cocher indique l’acceptation de conditions, de politiques ou une confirmation, définissez-la comme « obligatoire » dans l’onglet « Validation ».

  • Tirez parti de la logique conditionnelle : masquez les cases à cocher jusqu’à ce qu’elles soient directement pertinentes en fonction des autres sélections effectuées dans le formulaire, afin d’optimiser l’expérience utilisateur.