Champs de saisie

• Voir la page de documentation du composant sur le Système de Design de l’État Ouvre une nouvelle fenêtre
• Voir la page d’exemple du Système de Design de l’État Ouvre une nouvelle fenêtre

Documentation du tag

Returns a input item. Prefer the use of an actual form (see documentation)

Takes a dict as parameter, with the following structure:

data_dict = {
    "id": "The unique html id of the input item",
    "label": "Label of the input item",
    "type": "Type of the input item (default: 'text')",
    "onchange": "(Optional) Action that happens when the input is changed",
    "value": "(Optional) Value of the input item",
    "min": "(Optional) Minimum value of the input item (for type='date')",
    "max": "(Optional) Maximum value of the input item (for type='date')",
    "extra_classes": "(Optional) string with names of extra classes"
}

All of the keys of the dict can be passed directly as named parameters of the tag.

Tag name: dsfr_input

Usage: {% dsfr_input data_dict %}

Exemples

Exemple 1

{'id': 'example-input-id',
 'label': 'Label du champ de saisie',
 'onchange': 'alert(value)',
 'type': 'text',
 'value': '(Optionnel) valeur du champ de saisie'}

Exemple 2

{'label': 'Champ de saisie de date',
 'max': '2021-09-23',
 'min': '2021-09-04',
 'onchange': 'alert(value)',
 'type': 'date',
 'value': '2021-09-16'}