Tạo biểu mẫu

Thuộc phần Biểu mẫu trong hành trình Django của Coddy. Bài học 6 trên 20.

Trang tại /events/new/ tự viết từng nhãn và ô nhập, còn EventForm liệt kê lại các trường đó. Một biểu mẫu có thể tự hiển thị: truyền biểu mẫu vào mẫu rồi viết {{ form }} bên trong thẻ <form>. Trang liên hệ:

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

{{ form }} tạo nhãn và ô nhập cho từng trường, theo thứ tự mà lớp khai báo. Mỗi ô nhập có name và một id như id_email, để nhãn liên kết với ô đó. Bạn vẫn tự viết thẻ biểu mẫu, token và nút.

Một biểu mẫu chưa có dữ liệu nào là lớp được gọi mà không có dữ liệu: ContactForm(). Django cũng thêm required vào các ô nhập bắt buộc, để trình duyệt chặn trường trống trước khi gửi. Ô nhập ngày giờ đây chỉ là văn bản, vì Django hiển thị DateField dưới dạng văn bản. Nhập ngày theo dạng 2031-12-05.

Thử thách

Dễ

Để EventForm tự tạo các trường của biểu mẫu.

Trong new_event, truyền một EventForm trống cho mẫu dưới tên form.
Trong new_event.html, thay ba nhãn và ô nhập bằng {{ form }}, để nó tạo chúng cho bạn. Giữ nguyên thẻ biểu mẫu, token, nút và thông báo lỗi.

Thêm một sự kiện có ngày 2031-12-05: Django đã tạo mọi nhãn và bạn sẽ đến trang của sự kiện.

Tự làm thử

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