필드별로

Coddy Django 여정의 폼 섹션에 포함된 레슨. 20개 중 8번째.

{{ form }}은 모든 필드를 동일한 방식으로, 하나씩 아래로 그립니다. 각 필드를 원하는 상자에 넣으려면 필드를 한 번에 하나씩 그리세요.

양식은 필드의 목록입니다. {% for field in form %}은 클래스에 선언된 순서대로 필드를 제공합니다. {{ field.as_field_group }}은 레이블, 오류 및 입력란을 포함한 필드 하나를 그립니다. 이름 두 개를 나란히 표시하는 가입 페이지:

<div class="row">
    <div class="half">{{ form.first_name.as_field_group }}</div>
    <div class="half">{{ form.last_name.as_field_group }}</div>
</div>

{{ form.email }}만 사용하면 입력란만 그려집니다. 레이블도 없고, 무엇이 잘못되었는지 알려주는 오류 메시지도 없습니다.

스타일시트에는 이미 각 상자를 카드로 바꾸는 .field 규칙이 있습니다.

챌린지

쉬움

new_event.html에서 {{ form }}을 폼의 필드들을 순회하는 루프로 바꾸세요. 각 필드를 별도의 <div class="field"> 안에 넣고, 레이블과 오류 및 입력 필드도 함께 넣으세요.

실행을 누르고 날짜 next friday를 입력한 다음 날짜 입력 상자 안에서 오류를 찾으세요.

직접 해보기

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

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

{% block content %}
<h1>Add an event</h1>
<form method="post">
    {% csrf_token %}
    {{ form }}
    <button type="submit">Add event</button>
</form>
{% endblock %}