# Paramètres des champs

Étiquettes, espaces réservés, valeurs par défaut, règles de validation et options par champ.

## Paramètres des champs

Chaque question dispose de paramètres communs — titre, obligatoire, espace réservé — ainsi que d’options spécifiques au type comme les limites de caractères, les restrictions de fichiers et les règles de validation. Cette page les couvre tous.

<h2 id="accessing-settings">Accéder aux paramètres d’un champ</h2>
<p>
  Tapez le titre d’une question et ses options directement sur le canevas. Tout le reste se trouve dans le menu du bloc : cliquez sur la
  poignée de déplacement sur le bord gauche du bloc (ou touchez l’indicateur du bloc sur un écran tactile) et choisissez parmi{' '}
  <strong>Convertir en</strong>, <strong>Options</strong>, <strong>Validation</strong>, et les actions habituelles de duplication /
  déplacement / masquage / suppression.
</p>

<h2 id="common-settings">Paramètres communs</h2>
<p>Ces options apparaissent sur chaque champ de question, quel que soit son type.</p>

<p>
  La clé d’un champ — le nom sous lequel les automatisations le pré-remplissent et le lisent — se définit dans le tableau{' '}
  <strong>Clés</strong>, que l’icône clé de la barre d’outils ouvre pour tout le formulaire : une clé par champ, option, ligne et colonne.
  Laissez une clé vide pour utiliser celle dérivée du titre ou de l’intitulé. Modifier une clé sur un formulaire publié vous avertit que les
  automatisations utilisant l’ancienne clé cesseront de fonctionner. La ligne d’indice de chaque option porte aussi sa clé sous forme de
  puce modifiable sur place. Voir <a href="/fr/requests/field-keys">Clés de champ</a> pour savoir comment les clés sont dérivées, figées à
  la publication, et utilisées par les appelants.
</p>

> 💡 **Ajouter du texte d’aide**
> <p>
>     Formstep est un éditeur de style document — pour ajouter du texte d’aide ou des instructions pour une question, insérez un bloc de
>     paragraphe ou de titre au-dessus ou en dessous du champ dans le canvas. Les blocs de contenu entre les questions sont visibles pour les
>     répondants et fonctionnent comme n’importe quel autre bloc.
>   </p>

> ℹ️ **Visibilité du titre et données**
> <p>
>     Masquer un titre ne supprime pas le champ des soumissions. Il apparaît toujours comme en-tête de colonne dans les exports, alors donnez
>     un nom interne clair aux champs à titre masqué.
>   </p>

<h2 id="text-options">Options de texte</h2>
<p>
  <strong>Longueur minimale</strong> et <strong>Longueur maximale</strong> se trouvent sous <strong>Validation</strong> dans le menu du bloc
  et s’appliquent à <strong>Text Input</strong>, <strong>Text Area</strong> et <strong>Website URL</strong>. Text Area est la variante
  multi-lignes de Text Input — basculez entre eux avec <strong>Convertir en</strong>.
</p>

<h2 id="number-options">Options de nombre</h2>
<p>
  <strong>Minimum</strong> et <strong>Maximum</strong> se trouvent sous <strong>Validation</strong> et s’appliquent à{' '}
  <strong>Number</strong>, <strong>Star Rating</strong> et un linear scale. <strong>Number</strong> propose aussi <strong>Pas</strong> : la
  réponse doit être un multiple de celui-ci, si bien qu’un pas de 1 n’accepte que des nombres entiers et 0,5 accepte les demis. Laissez-le
  vide pour accepter n’importe quel nombre.
</p>

<h2 id="choice-options">Options de choix</h2>
<p>
  Ces paramètres s’appliquent aux champs basés sur des choix : <strong>Radio Buttons</strong>, <strong>Checkboxes</strong>,{' '}
  <strong>Dropdown</strong>, <strong>Ranking</strong>, <strong>Single Picture Choice</strong> et <strong>Multi Picture Choice</strong>.
</p>

<p>
  Chaque option peut aussi être masquée ou présélectionnée depuis le canevas : le curseur dans une option, appuyez sur ⌘ + H (Ctrl + H) pour
  la masquer, ou sur ⌘ + D (Ctrl + D) pour la sélectionner par défaut.
</p>

<h2 id="rating-scale-options">Options de notation et d’échelle</h2>

<h3 id="rating">Notation</h3>
<p>
  Le champ <strong>Star Rating</strong> affiche 5 étoiles par défaut. Utilisez <strong>Augmenter le nombre maximum d'étoiles</strong> et{' '}
  <strong>Diminuer le nombre maximum d'étoiles</strong> dans le menu du bloc pour choisir une valeur entre 1 et 10. Convertissez-le en
  linear scale depuis le même menu ; le maximum est conservé et les éléments de menu deviennent{' '}
  <strong>Augmenter / Diminuer le maximum de l'échelle</strong>.
</p>

<h3 id="matrix">Matrice</h3>
<p>
  Le champ <strong>Matrix / Grid</strong> crée une grille de choix. Définissez les <strong>Lignes</strong> (les sous-questions) et les{' '}
  <strong>Colonnes</strong> (les réponses). Le répondant choisit une colonne par ligne. Sous <strong>Validation</strong>, vous pouvez{' '}
  <strong>Exiger toutes les lignes</strong> ou définir <strong>Lignes minimum répondues</strong>.
</p>

<h2 id="file-payment-options">Options de téléchargement de fichiers et de paiement</h2>

<h3 id="file-upload">Téléchargement de fichiers</h3>
<p>
  <strong>File Upload</strong> propose <strong>Fichiers minimum</strong>, <strong>Fichiers maximum</strong>,{' '}
  <strong>Taille maximale (Mo)</strong> et <strong>Types acceptés</strong> sous <strong>Validation</strong>. Voir{' '}
  <a href="/fr/building-forms/file-uploads-signatures">Téléversements de fichiers et signatures</a> pour le détail.
</p>

<h3 id="payment">Paiement</h3>
<p>
  Le champ <strong>Payment</strong> collecte un paiement unique. Définissez le <strong>Montant</strong> et la <strong>Devise</strong> sur le
  bloc — USD, EUR, GBP, JPY, CAD, AUD, CHF, SEK, NOK, DKK, NZD, SGD, HKD, AED ou TRY. Chaque devise a un montant minimum (0,50 pour USD et
  EUR), et la publication est bloquée tant que Stripe n'est pas connecté et que le montant n'est pas valide. Voir{' '}
  <a href="/fr/building-forms/payment-collection">Collecte de paiements</a>.
</p>

<h2 id="default-values">Valeurs par défaut issues d’autres champs</h2>
<p>
  La valeur par défaut d’un champ peut provenir d’un autre champ du même formulaire au lieu d’un texte fixe — un champ masqué (par exemple
  un paramètre d’URL) ou un champ calculé. Cela fonctionne sur les six champs de saisie qui ont un emplacement de valeur par défaut :{' '}
  <strong>Text Input</strong>, <strong>Text Area</strong>, <strong>Email</strong>, <strong>Website URL</strong>,{' '}
  <strong>Phone Number</strong> et <strong>Number</strong>.
</p>
<p>Pour le configurer :</p>
<ol>
  <li>Cliquez dans le champ de saisie.</li>
  <li>
    Tapez <kbd>@</kbd> comme premier caractère. Un menu liste vos champs masqués et calculés ; continuez à taper pour filtrer.
  </li>
  <li>
    Choisissez un champ. Le champ de saisie passe de lui-même en mode <strong>valeur par défaut</strong> et l’affiche sous forme de puce,
    par exemple <strong>@recipient</strong>.
  </li>
</ol>
<p>
  Pour supprimer la référence, cliquez sur le <strong>×</strong> de la puce, appuyez sur <kbd>Backspace</kbd>, ou appuyez de nouveau sur{' '}
  <kbd>⌘</kbd> + <kbd>D</kbd>. Si vous préférez un <kbd>@</kbd> littéral à la place — un espace réservé comme <code>@yourhandle</code> —,
  appuyez sur <kbd>Esc</kbd> pour fermer le menu et continuez à taper ; le champ de saisie reste dans le mode où il était. Une puce devient
  rouge lorsque son champ a été supprimé ; réajouter un champ portant le même nom la reconnecte.
</p>
<p>
  La puce remplace le texte d’espace réservé du champ. Le <kbd>@</kbd> n’ouvre le menu que comme premier caractère, donc une valeur par
  défaut comme <code>jeff@example.com</code> reste du texte brut.
</p>
<p>
  Quand quelqu’un ouvre le formulaire, le champ est pré-rempli avec la valeur référencée — par exemple, un lien se terminant par{' '}
  <code>?recipient=Jeff</code> remplit un Text Input qui référence le champ masqué <code>recipient</code> avec "Jeff". Voici comment cela se
  comporte :
</p>
<ul>
  <li>Les répondants peuvent modifier ou effacer la valeur. Leur propre réponse n’est jamais écrasée.</li>
  <li>
    Un champ calculé remplit le champ de saisie avec la première valeur qu’il possède — généralement sa valeur initiale. Les modifications
    ultérieures effectuées par des règles logiques ne remplacent pas ce qui est déjà présent dans le champ de saisie.
  </li>
  <li>
    Si le champ référencé n’a pas de valeur, le champ de saisie démarre vide. Un champ Number reste également vide lorsque la valeur n’est
    pas un nombre (par exemple <code>?age=abc</code>).
  </li>
  <li>La soumission stocke les deux valeurs : le champ masqué ou calculé, et la réponse finale de la question.</li>
</ul>
<p>
  Voir <a href="/fr/building-forms/hidden-fields">Champs masqués</a> et <a href="/fr/building-forms/calculated-fields">Champs calculés</a>.
</p>

<h2 id="examples">Exemples</h2>

<ul>
  <li>
    <strong>Formulaire de contact</strong> — Champ Email marqué obligatoire, Text Area pour le message avec un espace réservé "Dites-nous
    comment nous pouvons vous aider…", champ Phone Number marqué comme facultatif, avec un paragraphe en dessous : "Nous vous appellerons
    uniquement si nous devons clarifier votre demande"
  </li>
  <li>
    <strong>Sondage NPS</strong> — Star Rating réglé à 10 étoiles, suivi d’un Text Area (masqué par défaut, affiché via la logique
    conditionnelle quand le score est de 6 ou moins) avec l’espace réservé "Qu’est-ce que nous pourrions améliorer ?"
  </li>
  <li>
    <strong>Commande de produit</strong> — Champ Number pour la quantité avec un minimum de 1 / maximum de 100, Checkboxes pour les
    compléments, et un champ de paiement dont le montant est piloté par un champ calculé
  </li>
  <li>
    <strong>Inscription à un événement</strong> — Radio Buttons pour la présence, Checkboxes pour les restrictions alimentaires avec un
    ordre aléatoire pour éviter les biais, Date Picker avec une date la plus proche définie
  </li>
</ul>
<h2 id="validation-rules">Règles de validation</h2>

<p>
  La validation s’exécute pendant que le répondant remplit votre formulaire. Formstep met en évidence les saisies incorrectes en ligne et
  refuse de soumettre tant que tout n’est pas valide.
</p>

<h3 id="built-in-validation">Intégrée par type de champ</h3>

<p>
  Chaque type de question vérifie sa propre forme, sans rien à configurer. <strong>Email</strong> vérifie le format de l'adresse.{' '}
  <strong>Website URL</strong> n'accepte que les liens http et https et rejette un hôte qui n'est pas un vrai domaine.{' '}
  <strong>Phone Number</strong> vérifie le numéro par rapport au pays sélectionné. <strong>Number</strong>, <strong>Date Picker</strong> et{' '}
  <strong>Time Picker</strong> rejettent tout ce qui n'est pas un nombre, une date ou une heure.
</p>

<p>
  Sur Business, une question e-mail peut en plus exiger une vérification — le répondant confirme cette adresse avec un code à usage unique
  avant que le formulaire n'accepte la soumission. Le bouton se trouve sous <strong>Validation → Vérification</strong>. Voir{' '}
  <a href="/fr/building-forms/email-verification">vérification e-mail des répondants</a>.
</p>

<h3 id="optional-rules">Règles facultatives par champ</h3>

<p>
  Ouvrez le menu du bloc et choisissez <strong>Validation</strong>. Les règles proposées dépendent du type de question ; ce sont les
  libellés exacts du menu.
</p>

<p>
  Radio Buttons, Dropdown, Toggle Switch, Signature, Ranking, Payment et Planifier un rendez-vous ne prennent aucune règle de validation —
  obligatoire ou non est le seul choix. À l'intérieur d'un groupe répétable, la vérification par e-mail n'est pas proposée.
</p>

<h3 id="custom-patterns">Exemples de motifs personnalisés</h3>

<ul>
  <li>
    <strong>Code postal américain</strong> — <code>{`^\\d{5}(-\\d{4})?$`}</code>
  </li>
  <li>
    <strong>Code couleur hexadécimal</strong> — <code>{`^#[0-9a-fA-F]{6}$`}</code>
  </li>
  <li>
    <strong>Slug compatible URL</strong> — <code>{`^[a-z0-9-]+$`}</code>
  </li>
</ul>

<p>
  Une valeur qui ne correspond pas affiche une erreur générique "Valeur invalide", ajoutez donc un paragraphe près du champ décrivant le
  format attendu. Une regex invalide est ignorée et ne bloque jamais la soumission. Les règles de longueur comptent les caractères après
  suppression des espaces en début et en fin.
</p>

<h3 id="how-validation-runs">Comment la validation s’exécute</h3>

<p>
  Formstep vérifie la validation en temps réel dans le navigateur pendant que le répondant tape. Les erreurs de format et de règles
  apparaissent immédiatement avec un message en ligne ; une erreur "Ce champ est obligatoire" apparaît une fois que le champ a été touché,
  ou lorsque le répondant tente de soumettre.
</p>

> ⚠️ **Ne validez pas les données sensibles avec la regex seule**
> <p>
>     Pour des éléments comme les cartes de crédit ou les pièces d’identité officielles, utilisez le type de champ ou l’intégration approprié.
>     La regex vérifie la forme, pas la validité.
>   </p>

<h2 id="next-steps">Étapes suivantes</h2>
<div class="not-prose grid gap-3 sm:grid-cols-2">
  - [Insertion de réponses](/fr/building-forms/answer-piping) — Utilisez les mentions @ pour référencer des réponses n'importe où dans votre formulaire.
  - [Logique conditionnelle](/fr/building-forms/conditional-logic) — Afficher ou masquer des champs en fonction des réponses
  - [Champs masqués](/fr/building-forms/hidden-fields) — Capturer les paramètres URL de manière invisible
  - [Champs calculés](/fr/building-forms/calculated-fields) — Calculer des scores, des totaux et des valeurs dynamiques
</div>