Menu
CoddyTech

Créer un formulaire

Fait partie de la section Formulaires du Journey Django de Coddy. Leçon 6 sur 20.

La page /events/new/ écrit chaque étiquette et chaque champ à la main, et EventForm répertorie à nouveau les mêmes champs. Un formulaire peut se dessiner lui-même : passez-en un au modèle et écrivez {{ form }} à l’intérieur de la balise <form>. Une page de contact :

<form method="post">
    {% csrf_token %}
    {{ form }}
    <button type="submit">Send</button>
</form>

{{ form }} écrit une étiquette et un champ pour chaque champ du formulaire, dans l’ordre où la classe les déclare. Chaque champ reçoit le name du champ et un id comme id_email, afin que son étiquette pointe vers lui. La balise du formulaire, le jeton et le bouton restent sous votre responsabilité.

Un formulaire dans lequel rien n’a encore été saisi correspond à la classe appelée sans données : ContactForm(). Django marque également les champs obligatoires avec required, afin que le navigateur bloque l’envoi si un champ est vide.

challenge icon

Défi

Facile
  • Dans new_event, transmettez un EventForm vide au modèle sous le nom form.
  • Dans new_event.html, remplacez les libellés et les champs de saisie par le formulaire lui-même. Conservez la balise de formulaire, le jeton, le bouton et le message d’erreur.

Cliquez sur Run et ouvrez /events/new/ : Django affiche les champs.

Essayez vous-même

{% extends "events/base.html" %}

{% block title %}Add an event{% endblock %}

{% block content %}
<h1>Add an event</h1>
{% if error %}
<p class="error">{{ error }}</p>
{% endif %}
<form method="post">
    {% csrf_token %}
    <label for="title">Title</label>
    <input id="title" name="title">
    <label for="date">Date</label>
    <input id="date" name="date" type="date">
    <label for="place">Place</label>
    <input id="place" name="place">
    <button type="submit">Add event</button>
</form>
{% endblock %}

Toutes les leçons de Formulaires

Entraînez-vous par vous-même : Playground Django