0

我正在尝试将引导程序应用于 django 登录表单。我已经搜索了谷歌几个小时，几乎每个人都在说同样的事情，那就是设置自定义authentication_form，urls.py覆盖自定义登录表单中的用户名和密码字段，并通过小部件的attrs参数传递类。我已经这样做了，但 django 仍然没有将表单控件类应用于我的输入字段。我不太确定出了什么问题。表单仍然呈现，但没有应用引导样式。

网址.py

from django.conf.urls import url
from django.contrib.auth.views import LoginView, LogoutView, 
    PasswordChangeView, PasswordChangeDoneView, \
    PasswordResetView, PasswordResetDoneView, 
    PasswordResetConfirmView, PasswordResetCompleteView

from account.forms import LoginForm
from account.views import dashboard

urlpatterns = [
    url(r'^$', dashboard, name='dashboard'),
    url(r'^login/$', LoginView.as_view(), {'authentication_form': 
        LoginForm}, name='login'),
    url(r'^logout/$', LogoutView.as_view(), name='logout'),
    url(r'^password-change/$', PasswordChangeView.as_view(), 
        name='password_change'),
    url(r'^password-change/done/$', PasswordChangeDoneView.as_view(), 
        name='password_change_done'),
    url(r'^password-reset/$', PasswordResetView.as_view(), 
        name='password_reset'),
    url(r'^password-reset/done/$', PasswordResetDoneView.as_view(), 
        name='password_reset_done'),
    url(r'^password-reset/(?P<uidb64>[0-9A-Za-z_\-]+)/(?P<token>[0-9A-
        Za-z]{1,13}-[0-9A-Za-z]{1,20})/$',
        PasswordResetConfirmView.as_view(), 
        name='password_reset_confirm'),
    url(r'^password-reset/complete/$', 
        PasswordResetCompleteView.as_view(), 
        name='password_reset_complete')
]

表格.py

from django.contrib.auth.forms import AuthenticationForm
from django.forms import CharField, TextInput, PasswordInput


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

视图.py

@login_required(
    redirect_field_name=reverse_lazy('login'),
    login_url=reverse_lazy('login'))
def dashboard(request):
    return render(request, 'account/dashboard.html', {'section': 
        'dashboard'})

登录表单

4

1 回答 1

0

在我的模板中，我使用Widget Tweaks 

<form method='POST' action="/" enctype='multipart/form-data'>
 {% load widget_tweaks %}
 {% csrf_token %}
 {{ form.first_name |add_class:"customCSS1 customCSS2" }}
 {{ form.second_name |add_class:"form-control customCSS4" }}
</form>
{{ form.media.js }}

使用此插件，您可以根据需要设置表单样式。您可以添加您的form-control课程或使用个人 CSS 课程，例如

.customCSS1{
  width60%;
  border-radius:5px;
 }
于 2017-07-11T01:32:28.763 回答