Corfix Form Builder : utilisation du composant « Panel ».

1. Onglet « Affichage »

L'onglet « Affichage » permet de contrôler l'apparence et l'identification du composant de panneau.

• Titre :

  • Il s'agit du titre principal affiché en haut du panneau sur le formulaire proprement dit. C'est un élément clé pour l'organisation de votre formulaire.

  • Exemple : « Coordonnées du demandeur », « Portée du projet », « Liste de contrôle de sécurité ».

• Couleur :

  • Vous permet de sélectionner une palette de couleurs prédéfinie pour le panneau, ce qui peut aider à différencier visuellement les sections.

  • Par défaut : Par défaut.

• Info-bulle :

  • Texte qui s'affiche lorsque l'utilisateur passe la souris sur le titre du panneau. Utile pour fournir une aide rapide ou du contexte pour l'ensemble de la section.

• Classe CSS personnalisée :

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

• Réductible :

  • Si cette option est cochée, l’utilisateur peut développer ou réduire le panneau, ce qui lui permet de masquer ou d’afficher son contenu. Cette fonctionnalité est utile pour les longs formulaires ou les sections facultatives.

• Masquer le libellé :

  • Cette option est généralement moins pertinente pour les panneaux, car leur identifiant principal est le « Titre ». Si cette option est cochée, elle masquera le libellé générique « Panneau », mais pas le « Titre ».

• Édition 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).

2. Onglet « Conditionnel »

L'onglet « Conditionnel » vous permet de définir des règles déterminant quand l'ensemble de ce composant de panneau (et tous les composants qu'il contient) doit être affiché ou masqué 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 le panneau « Coordonnées en cas d’urgence » ne s’affiche que lorsque la case « Avez-vous un contact en cas d’urgence ? » est cochée.

Fenêtre d’aperçu

La zone d’aperçu située à droite de la boîte de dialogue vous montre à quoi ressemblera visuellement le « panneau » sur votre formulaire. Elle affiche une zone rectangulaire avec un « titre » en haut, représentant l’espace où seraient placés d’autres composants du formulaire. Cela vous aide à visualiser comment le contenu sera organisé au sein du panneau.

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

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

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

• Supprimer : supprime le composant « Panneau » et tous les composants qu’il contient du formulaire.

Bonnes pratiques pour le composant « Panneau » :

• Utilisez un titre clair : attribuez toujours à votre panneau un « titre » descriptif (par exemple, « Informations personnelles », « Détails professionnels ») afin de regrouper les champs de manière logique.

• Améliorez la lisibilité : utilisez des panneaux pour diviser les longs formulaires en sections gérables et visuellement distinctes.

• Rendez-le repliable pour les sections facultatives ou longues : si une section contient de nombreux champs ou n’est pas toujours pertinente, rendre le panneau « repliable » permet de raccourcir le formulaire.

• Appliquez une logique conditionnelle : affichez ou masquez des panneaux entiers en fonction des saisies de l’utilisateur, afin de créer des formulaires dynamiques qui s’adaptent à des situations spécifiques.

• Envisagez l’utilisation de la couleur pour la différenciation : utilisez la « couleur » pour distinguer visuellement les différents types de panneaux ou mettre en évidence les sections essentielles, mais utilisez-la avec parcimonie afin de conserver un design épuré.