我的登录页面看起来不像我想要的那样,就像这个 Bootstrap 登录页面就在这里 https://getbootstrap.com/docs/4.0/examples/sign-in/ .这是 what it looks like right now
如果你能帮我解决这个问题,那将是我的世界。
此外,如果您认为这是因为我没有链接到 CSS 页面,这就是我的基本模板的外观和结构:
{% load staticfiles %}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Accounts</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="{% static 'accounts/signin.css' %}" />
</head>
<body>
<div class="jumbotron">
<div class="container">
{% block main_content %}
{% endblock %}
</div>
</div>
</body>
</html>
View .py
from django.contrib.auth import (
authenticate,
get_user_model,
login,
logout,
)
from django.shortcuts import render
from django.http import HttpResponse,HttpResponseRedirect
from .forms import UserLoginForm
# Create your views here.
def login_view(request):
title = "Login"
form = UserLoginForm(request.POST or None)
if form.is_valid():
username = form.cleaned_data.get("username")
password = form.cleaned_data.get('password')
user = authenticate(request, username=username, password=password)
if user is not None:
login(request, user)
# or any other success page
# return HttpResponse("Logged in")
return HttpResponseRedirect('accounts/home')
return render(request, "accounts/form.html", {"form":form, "title": title})
表单.py
from django import forms
from django.contrib.auth import (
authenticate,
get_user_model,
login,
logout,
)
User = get_user_model()
class UserLoginForm(forms.Form):
username = forms.CharField()
password = forms.CharField(widget=forms.PasswordInput)
class Meta:
model = User
fields = ('username', 'email', 'password')
def clean(self,*args,**kwargs):
username = self.cleaned_data.get("username")
password = self.cleaned_data.get("password")
user = authenticate(username=username,password=password)
if not user:
raise forms.ValidationError("This user does not exist")
if not user.check_password(password):
raise forms.ValidationError("Incorrect Password")
if not user.is_active:
raise forms.ValidationError("This user is no longer active.")
return super(UserLoginForm, self).clean(*args,**kwargs)
form.html(目前用于登录,开放使用相同格式注册)
{% extends 'accounts/base.html' %}
{% block main_content %}
<div class="container">
<div class='col-sm-6 col-sm-offset-3'>
<h1>{{ title }}</h1>
<form method='POST' action='' enctype='multipart/form-data'>{% csrf_token %}
{{ form }}
<input type='submit' class='btn btn-primary btn-block' value='{{ title }}' />
</form>
</div>
</div>
{% endblock %}
非常感谢
@Lemayzeur 这是what my site looks like now
这是 what I want it to look like
- 它非常接近,但不幸的是它不一样。尽管如此,我会保留它并谢谢你。
最佳答案
您的 CSS 文件运行良好,因为该按钮继承了 Bootstrap 设计,
问题是您拥有的所有输入都没有 form-control
类。所以要添加这些类,您可以使用小部件来完成
class UserLoginForm(forms.Form):
username = forms.CharField(max_length=120,
widget=forms.TextInput(attrs={'class':'form-control',"placeholder":"Username"}))
password = forms.CharField(max_length=100,
widget=forms.PasswordInput(attrs={'class':'form-control',"placeholder":"Password"}))
关于python - BOOTSTRAP 登录模板不适用于 FORM,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50635143/