覆盖 Django 的 AuthenticationForm 字段

Question

我正在使用 Django 的身份验证后端并且工作正常，但我想为用户名和密码字段提供自定义 CSS class。我一直在尝试寻找解决方案，但在这里或其他任何地方都找不到任何东西。这是我到目前为止所做的：

project/forms.py:

from django import forms
from django.contrib.auth.forms import AuthenticationForm

class LoginForm(AuthenticationForm):
    username = forms.CharField(widget=forms.TextInput(attrs={'class': 'form-control form-control-lg'}))
    password = forms.CharField(widget=forms.PasswordInput(attrs={'class': 'form-control form-control-lg'}))

project/urls.py:

from django.contrib import admin
from django.urls import path, include
from .forms import LoginForm

urlpatterns = [
    path('accounts/', include('django.contrib.auth.urls'), {'authentication_form': LoginForm}),
]

accounts/login.html:

<form method="POST">
    {% csrf_token %}
    <div class="form-group">
        {{ form.username }}
        {{ form.password }}
    <button type="submit" class="btn btn-primary btn-lg btn-block">Sign in</button>
</form>

登录系统可以正常工作，但我无法显示 CSS 更改。我检查了用户名和密码字段，但它们根本没有显示在浏览器中。我猜我在某处遗漏了什么？

Answer 1

不确定如何直接执行此操作，但我使用 widget-tweaks 来执行此操作，并且效果很好（还执行所有错误通知）。您不需要在表单中设置任何内容，一切都在模板中完成。模板中的行将是：

    {% with "form-control input-field-"|add:form.username.name as field_class %}{% render_field form.username class=field_class %}{% endwith %}

这将为每个输入字段提供一个单独的 class。看看 https://github.com/jazzband/django-widget-tweaks.

Answer 2

它不起作用的原因是因为您添加的 {'authentication_form': LoginForm} 的路径中包含 include(....)，这是不可能的，您需要仅将其传递给登录名 url（或您覆盖该表单的登录名）：

from django.contrib.auth.views import LoginView

urlpatterns = [
    path('accounts/login/', LoginView.as_view(authentication_form=LoginForm)),
    path('accounts/', include('django.contrib.auth.urls')),
]

覆盖 Django 的 AuthenticationForm 字段

Override Django's AuthenticationForm's fields

python

django

django-forms

django-authentication