如何向 django auth 登录表单添加类属性？

Question

我刚刚安装了 Django 的默认身份验证应用程序。它正在工作，一切正常，但我想知道如何更改表单的 CSS。

说我有这个：

<form ...>
    <input type="text" class="input-class" placeholder="user">
    <input type="submit" value="login" />
</form>

...这将在文本输入中显示一个漂亮的表格。

但目前我有Django auth的简单丑陋的login.html模板：

<form method="post" action="{% url 'login' %}">
{% csrf_token %}

<div>
   <td>{{ form.username.label_tag }}</td>
   <td>{{ form.username }}</td>
</div>

我想要做的是用第一个的 CSS 类获得第二个表单。

有没有办法在不弄乱模型和表格的情况下这样做？而且，如果没有，有人可以给我指路吗？

非常感谢。

Answer 1

我希望有一种简单的方法来做到这一点，而不会弄乱表单或安装第三方应用程序。但是，不幸的是，情况并非如此。

如果您不想安装任何应用程序，您可以扩展AuthenticationForm：

class PrettyAuthenticationForm(AuthenticationForm):
    class Meta:
        widgets = {
            'username': forms.TextInput(attrs={'class': 'input-class'})
        }

然后，如果您使用的是LoginView，请PrettyAuthenticationForm使用authentication_form参数传递新的（有关更多详细信息，请参阅链接）。

但我不知道这是否值得所有的麻烦。我已经做过几次了，但通常我更喜欢安装django-widget-tweaks或django-crispy-forms。

如果您只需要在这里和那里添加一些 css 类，并且您使用的是自定义 css 集，我建议使用django-widget-tweaks。

如果您有多个表单，并且您正在使用一些 CSS 框架，例如 Bootstrap 或 Foundation，我建议您使用django-crispy-forms。

以django-widget-tweaks为例，首先安装它：

pip install django-widget-tweaks

添加它做你的settings.py

INSTALLED_APPS = [
    # ...

    'widget_tweaks',
]

在您的模板中，将其加载到文件顶部：

{% load widget_tweaks %}

然后在你的领域使用它：

{{ form.username|add_class:'input-class' }}