# Propriétés du Champ

Les types de réponses basées sur des champs peuvent être personnalisés en utilisant les propriétés liées aux champs suivantes.

## 📏 Dimensionnement

Comme la taille des champs n'est pas fixe, vous pouvez la personnaliser entièrement en définissant une largeur et une hauteur personnalisées.

![](https://186103257-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBhEHQX1dJgLFMgYGxh%2F-MBhFu6lfT2Ic4ivQi3-%2Fimage.png?alt=media\&token=1d466aa1-7ff8-4177-a848-e66be525b283)

{% hint style="info" %}
Forcer la largeur peut casser la mise en page responsive sur les appareils mobiles ; vous pouvez plutôt envisager de modifier la largeur des champs à l'aide de [CSS](https://docs.ngsurvey.com/fr/form-management/style-branding/style-editor/css) et définir des tailles appropriées en fonction de la largeur d'écran et du dispositif du répondant (bureau, mobile).  &#x20;
{% endhint %}

## &#x20;🔤 Définir un texte par défaut

Chacun de vos champs peut être prérempli à l'aide d'un texte par défaut. Ce texte par défaut sera défini comme valeur du champ la première fois que le Sondage est affiché au Répondant.&#x20;

![](https://186103257-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBhHWyAPXIyfmQgq0GD%2F-MBhIr3umJWtJPR116Lx%2Fimage.png?alt=media\&token=0f82f8a9-e5cf-489a-93f8-01e31e28c916)

{% hint style="info" %}
Vous pouvez également [insérer via pipe](https://docs.ngsurvey.com/fr/form-management/form-designer/piping/text-data-piping) en temps réel les réponses du répondant provenant d'autres questions dans votre champ à l'aide de l' [insérer via pipe ](https://docs.ngsurvey.com/fr/form-management/form-designer/piping/text-data-piping)icône.
{% endhint %}

## 📄 Texte d'eau de fond

Le texte d'eau de fond sera affiché dans le champ tant que la valeur du champ est vide ; il disparaît dès que le Répondant saisit une réponse dans le champ.

![](https://186103257-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBhHWyAPXIyfmQgq0GD%2F-MBhJlatkh87bf1Aay37%2Fimage.png?alt=media\&token=88587eb7-3b54-4192-b23b-80d4a701d8cd)

## 🆘 Texte d'aide

Un texte d'aide peut être utilisé comme indication affichée sous le champ. Vous pouvez définir le texte d'aide depuis la [propriétés de réponse](https://docs.ngsurvey.com/fr/form-management/form-designer/answers/answer-properties) page.

![](https://186103257-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBhEHQX1dJgLFMgYGxh%2F-MBhGWSkJHCjfN-iTk0m%2Fimage.png?alt=media\&token=39e9622e-f100-41db-9d76-acb3208d749f)

![](https://186103257-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBhEHQX1dJgLFMgYGxh%2F-MBhGdt7DP_tE3GaHcRM%2Fimage.png?alt=media\&token=8d1e9aa2-9eba-4d58-9e95-8dbaaf01a5db)

## ⌨️ Modes de saisie

Le mode de saisie indique à l'appareil quel type de texte pourrait être saisi par le Répondant. Cette fonctionnalité est utile sur les appareils avec claviers virtuels, comme les mobiles, car ils adaptent leur clavier virtuel en fonction du mode de saisie sélectionné. &#x20;

Par exemple, sélectionner numérique comme mode de saisie ouvrira le clavier virtuel de l'appareil mobile avec uniquement les touches numériques.&#x20;

![](https://186103257-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBxUVIo74XmsvfLNhjR%2F-MBxUoqMeQKMFYehwnTV%2Fimage.png?alt=media\&token=80116a27-76ac-4366-b8a0-ab270c16f729)

{% hint style="info" %}
Vous pouvez consulter l' [référence des modes de saisie](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode) pour en savoir plus sur les différents modes.
{% endhint %}

### ☑️ Validation Javascript <a href="#input-modes" id="input-modes"></a>

Il est possible de définir la validation Javascript et la propriété Message de validation sur le [propriétés de réponse](https://docs.ngsurvey.com/fr/form-management/form-designer/answers/answer-properties/field-properties) pour utiliser du code javascript personnalisé afin de valider votre réponse. \
\
Dans le code ci‑dessous respondentAnswerValue sera remplacé par la valeur réelle du champ. Si le code renvoie false, ngSurvey bloquera l'envoi ou la navigation et affichera le message de validation.

```
return (respondentAnswerValue >= 18 && respondentAnswerValue <= 99);
```

Dans le code ci‑dessous nous utilisons getAnswer dans le contexte de validation pour obtenir une valeur d'une autre réponse dans le Sondage. Ici, nous recherchons une réponse dont l'alias de reporting est défini sur "hh\_people".&#x20;

<pre><code><a data-footnote-ref href="#user-content-fn-1">re</a>turn (respondentAnswerValue &#x3C;= validationContext.getAnswer('hh_people'));
</code></pre>

Le contexte de validation prend en charge les méthodes et propriétés suivantes

```typescript
export class ValidationContext {
   answer:Answer, // Réponse courante en cours de validation
   question:Question, // Question courante de la réponse en cours de validation
   questions:Question[], // Toutes les questions du Sondage
   answers: Answer[];  // Toutes les réponses du Sondage

  public getAnswer(id: string): string // Obtenir la valeur d'une réponse en recherchant son alias de reporting ou son id
  public isSelectedAnswer(id: string, value: string): boolean // Rechercher une question en fonction de son id ou de son alias de reporting et vérifier si la valeur donnée est sélectionnée 
}

```

[^1]:


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.ngsurvey.com/fr/form-management/form-designer/answers/answer-properties/field-properties.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
