Django form在模版中的渲染方式

ConnorK發表於2021-03-07

在使用Django做模板渲染的開發時,常會用到表單渲染,在這裡總結一下五種渲染方式。

一、forms.as_p

渲染表單為一系列的p標籤,每個p標籤包含一個欄位:

<p> 
   <label for="id_subject">Subject:</label>
   <input id="id_subject" type="text" name="subject" maxlength="100" />
</p>

二、forms.as_ul

渲染表單為一系列的li標籤,每個li 標籤包含一個欄位,它不包含ul標籤:

<li>
  <label for="id_subject">Subject:</label>
  <input id="id_subject" type="text" name="subject" maxlength="100" />
</li>

三、form.as_table

輸出表單為一個HTML的table:

<tr>
  <th>
    <label for="id_subject">Subject:</label>
  </th>
  <td>
    <input id="id_subject" type="text" name="subject" maxlength="100" />
  </td>
</tr>

四、for field in form

透過迭代form,獲取其中的所有field。field可引用的包括{{ field.label_tag }} , {{ field }} , {{ field.errors }} :

 {% for field in form %}
  <div class="form-group">
      {{ field.label_tag }}
     <div class="">
        {{ field }}
     </div>
     {{ field.errors }}
  </div>
 {% endfor %}
  • field.label_tag
    {{ field.label_tag }}輸出為field的label元素:
    <label for="id_message">Message:</label>
  • field
    {{ field }}輸出為field的input
    <input type="text" name="message" id="id_message" />
  • field.errors
    {{ field.errors }}field的errors元素(errors一般在form驗證出錯的時候顯示)
    'This field is required.'

五、form.fieldname

直接將form作為一個dict,引用其每一個field,比如 {{ form.title }} 引用form中的title這個field:

<div class="form-group">
   <label class="control-label">
       {{ form.title.label_tag }}    
   </label>
   <div class="">
       {{ form.title }}
   </div>
   {{ form.title.errors }}
</div>

這種方式一般用於form需要更加精準的樣式的時候,逐個元素逐個元素的編排到html中。

本作品採用《CC 協議》,轉載必須註明作者和本文連結

相關文章