Django 表单格式化

Django 表单是一个非常方便的工具，它能够帮助我们快速地创建 HTML 表单。在不做任何修改的情况下，Django 表单生成的 HTML 代码看起来非常乏味，而且样式比较难看。好在 Django 提供了一些工具来格式化表单，使其更加美观和易于使用。

在本文中，我们将探讨几种常见的 Django 表单格式化方法。

使用 Bootstrap

Bootstrap 是一个非常流行的前端框架，它提供了大量的样式和组件，可以帮助我们快速创建美观和响应式的 Web 应用程序。如果您熟悉 Bootstrap，您将会发现它非常适合使用 Django 表单。

要使用 Bootstrap，您需要将 Bootstrap 的 CSS 和 JavaScript 文件添加到您的模板中。然后，您可以使用 Django 的自定义 Widget，为您的表单字段添加 Bootstrap 类。例如，假设您有一个名为 email 的表单字段，您可以将其渲染为带有 Bootstrap 类的文本框，如下所示：

from django import forms

class ContactForm(forms.Form):
    name = forms.CharField(max_length=30)
    email = forms.EmailField()
    message = forms.CharField(widget=forms.Textarea)

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        self.fields['email'].widget.attrs.update({
            'class': 'form-control'
        })

在上面的例子中，我们将 email 字段的 widget 的 class 属性设置为 form-control，这是 Bootstrap 样式表中针对文本框使用的类。

使用 Crispy Forms

Crispy Forms 是一个基于 Bootstrap 的表单渲染器，它可以使用 Bootstrap 的网格系统来创建响应式布局。要使用 Crispy Forms，您需要先安装它：

pip install django-crispy-forms

然后，在您的表单类中，您需要将 FormMixin 添加到您的 FormView 视图中，并将 self.form_class 分配给一个 Crispy 对象：

from django.views.generic import FormView
from crispy_forms.helper import FormHelper
from crispy_forms.layout import Submit
from django import forms

class ContactForm(forms.Form):
    name = forms.CharField(max_length=30)
    email = forms.EmailField()
    message = forms.CharField(widget=forms.Textarea)

class ContactView(FormView):
    form_class = ContactForm
    template_name = 'contact.html'

    def get_form(self, form_class=None):
        form = super(ContactView, self).get_form(form_class)
        helper = form.helper
        helper.form_class = 'form-horizontal'
        helper.label_class = 'col-sm-2'
        helper.field_class = 'col-sm-10'
        helper.add_input(Submit('submit', 'Submit'))
        return form

在上面的例子中，我们通过创建一个 helper 对象来设置表单的样式。我们将 form_class，label_class 和 field_class 分别设置为 form-horizontal，col-sm-2 和 col-sm-10，这使得我们能够使用 Bootstrap 的网格系统来对表单进行布局。我们还添加了一个 Submit 按钮到表单中，以便用户可以提交表单。

自定义表单样式

如果您不想依赖第三方库来渲染 Django 表单，您可以使用自定义样式来格式化表单。例如，您可以将每个表单字段包装在 <div> 中，并将其样式设置为您想要的样式：

from django import forms

class ContactForm(forms.Form):
    name = forms.CharField(max_length=30)
    email = forms.EmailField()
    message = forms.CharField(widget=forms.Textarea)

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        for field in self.fields.values():
            field.widget.attrs.update({
                'class': 'form-control'
            })

在上面的例子中，我们遍历了表单中的字段，并将它们的 widget 的 class 属性设置为 form-control。我们还可以在模板中使用自定义 CSS 类，如下所示：

<form>
  <div class="form-group">
    {{ form.name.label_tag }}
    {{ form.name }}
  </div>
  <div class="form-group">
    {{ form.email.label_tag }}
    {{ form.email }}
  </div>
  <div class="form-group">
    {{ form.message.label_tag }}
    {{ form.message }}
  </div>
  <button type="submit" class="btn btn-primary">Submit</button>
</form>

在上面的例子中，我们将每个表单字段包装在一个带有 form-group 类的 <div> 中，这样可以使它们对用户更加友好。我们还添加了一个带有 btn 和 btn-primary 类的 Submit 按钮。

总结

在本文中，我们探讨了三种常见的 Django 表单格式化方法：使用 Bootstrap，使用 Crispy Forms 和使用自定义表单样式。无论您选择哪种方法，都可以使您的 Django 表单变得更加美观和易于使用。