這是一個快速教程，可幫助您開始使用django-crispy-forms, 并且永不回頭。Django-crispy-forms是一個很棒的第三方包，可讓您控制渲染Django表單的方式，而不會破壞默認行為。本教程將針對Bootstrap 4進行量身定制，但也可以與較舊的Bootstrap版本使用。

我喜歡在我的項目上使用它的主要原因是因為您可以使用它來簡單地渲染Django表單，并且可以通過Bootstrap 4很好地渲染它，并且設置非常簡單。

安裝

django文件上傳、使用pip安裝它：

pip install django-crispy-forms

將其添加到您的文件中，INSTALLED_APPS然后選擇要使用的樣式：

settings.py

INSTALLED_APPS = [    ...    'crispy_forms',]CRISPY_TEMPLATE_PACK = 'bootstrap4'

設置引導程序

您可以從getbootstrap.com下載最新的Bootstrap 4版本。在這種情況下，請轉到下載頁面并獲得Compiled CSS and JS版本。或者您可以使用托管的Bootstrap CDN：

為簡單起見，我將使用CDN版本。這是我的base.html模板，將在以下示例中引用：

jquery form。base.html

                  Django People        

我只添加了CSS文件，因為我們不會使用任何JavaScript功能。

基本用法

假設我們有一個名為Person如下的模型：

models.py

from django.db import modelsclass Person(models.Model):    name = models.CharField(max_length=130)    email = models.EmailField(blank=True)    job_title = models.CharField(max_length=30, blank=True)    bio = models.TextField(blank=True)

假設我們要創建一個視圖以添加新Person對象。在這種情況下，我們可以使用內置的CreateView：

element ui form？views.py

from django.views.generic import CreateViewfrom .models import Personclass PersonCreateView(CreateView):    model = Person    fields = ('name', 'email', 'job_title', 'bio')

無需進行任何進一步的更改，Django將嘗試使用名為的模板people/person_form.html。在這種情況下，“ people”是我的Django應用的名稱：

people / person_form.html

{% extends 'base.html' %}{% block content %}      {% csrf_token %}    {{ form }}    Save person  {% endblock %}

這是一個非常基本的表單呈現方式，Django會這樣渲染它，沒有樣式，只是普通的表單字段，一點也不美觀：

django表格。要使用Bootstrap 4 CSS類呈現相同的表單，您可以執行以下操作，使用form|crispy模板標簽即可，不過在使用前得先在模板中載入crispy_forms_tags。

people / person_form.html

{% extends 'base.html' %}{% load crispy_forms_tags %}{% block content %}      {% csrf_token %}    {{ form|crispy }}    Save person  {% endblock %}

現在的結果更好了：

在某些情況下，您可能需要更多自由來呈現字段。您可以通過手動呈現字段并使用as_crispy_field模板過濾器來實現：

{%?extends?'base.html'?%}{% load crispy_forms_tags %}**people/person_form.html**{% block content %}      {% csrf_token %}    

django教程。結果類似于下面的屏幕截圖：

表單助手(FormHelpler)

django-crispy-forms應用程序具有一個特殊的類，該類名為FormHelper，可以使您的生活更輕松，并讓您完全控制想要呈現表單的方式。

這是更新表單的示例：

表單form？forms.py

from django import formsfrom crispy_forms.helper import FormHelperfrom crispy_forms.layout import Submitfrom people.models import Personclass PersonForm(forms.ModelForm):    class Meta:        model = Person        fields = ('name', 'email', 'job_title', 'bio')    def __init__(self, *args, **kwargs):        super().__init__(*args, **kwargs)        self.helper = FormHelper()        self.helper.form_method = 'post'        self.helper.add_input(Submit('submit', 'Save person'))

該工作在__init__()方法內部完成，其余只是常規的Django模型形式。在這里，我定義此表單應使用POST方法處理請求，并且在表單定義了具有帶有“保存人”標簽的提交按鈕。(小編注：這樣你就不用在template里單獨手寫提交方法和提交button了。)

現在我們來看，只是常規的Django代碼：

views.py

from django.views.generic import UpdateViewfrom people.models import Personfrom people.forms import PersonFormclass PersonUpdateView(UpdateView):    model = Person    form_class = PersonForm    template_name = 'people/person_update_form.html'

然后在我們的模板中：

django。people / person_update_form.html

{%?extends?'base.html'?%}{% load crispy_forms_tags %}{% block content %}  {% crispy form %}{% endblock %}

在這里，{%?crispy form?%}這就是呈現Bootstrap 4表單所需的全部：

結論

基本來說就差不多了。老實說，這就是我經常使用django-crispy-form的全部。通常我不去使用 FormHelper這種東西，但是還有其它有意思的東西。如果您有興趣，可以查看其官方文檔：django-crispy-forms.readthedocs.io。

如果您不確定應該在哪里創建某個文件，可以在GitHub.github.com/sibtc/bootstrap-forms-example上獲取示例代碼。

django form？原文地址：

https://simpleisbetterthancomplex.com/tutorial/2018/08/13/how-to-use-bootstrap-4-forms-with-django.html

翻譯：大江狗

相關閱讀

Django限制表單中ForeignKey對應下拉菜單選項數量的兩種經典方法

django動態生成form？Django基礎(11): 表單集合Formset的高級用法

Django基礎(9): 表單Forms的高級使用技巧