יצירת טופס

חלק מהיחידה טפסים במסלול ה-Django של Coddy. שיעור 6 מתוך 20.

הדף בכתובת /events/new/ כותב כל תווית ושדה קלט באופן ידני, ו-EventForm מפרט שוב את אותם שדות. טופס יכול ליצור את עצמו: מעבירים אותו לתבנית וכותבים {{ form }} בתוך תגית <form>. דף יצירת קשר:

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

{{ form }} כותב תווית ושדה קלט לכל שדה, לפי הסדר שבו ה-class מגדירה אותם. כל שדה קלט מקבל את name של השדה ואת id כמו id_email, כך שהתווית שלו מצביעה אליו. תגית הטופס, האסימון והכפתור נשארים בשליטתך.

טופס שעדיין לא הוקלד בו דבר הוא המחלקה שנקראת בלי נתונים: ContactForm(). Django גם מסמן שדות קלט נדרשים באמצעות required, כך שהדפדפן עוצר שליחה של שדה ריק.

אתגר

קל

ב־new_event, העבר תבנית EventForm ריקה בתור form.
ב־new_event.html, החלף את התוויות ואת שדות הקלט בכך שהטופס יציג את עצמו. השאר את תגית הטופס, את האסימון, את הכפתור ואת הודעת השגיאה.

לחץ על הפעלה ופתח את /events/new/: Django מציג את השדות.

נסו בעצמכם

{% 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 %}