使用Django表单替代html表单
from django import forms #导入forms模块
class UserForm(forms.Form): #所有表单类都需要继承forms.Form
'''
这里一个字段定义的是一个input标签(里面设置属性)
label相当于label标签,max_length为设置该变量可以输入的最大字符
widget为设置input的类型,这里的passwordinput为type='password',添加属性使用attrs={}以字典键值对的形式,这里增加了class和placeholder属性
'''
username=forms.CharField(label='用户名',max_length=128,widget=forms.TextInput(attrs={'class':'form-control','placeholder':'用户名'}))
password=forms.CharField(label='密码',max_length=512,widget=forms.PasswordInput(attrs={'class':'form-control','placeholder':'密码'}))
2.修改view.py文件
def login(request):
if request.method=="POST": #提交表单后,满足请求为post就执行下面的内容
message = '所有字段都必须填写'
login_form=forms.UserForm(request.POST) #获取每个input标签
# username = request.POST.get('username') #获取表单中输入的用户名和密码
# password = request.POST.get('password')
# print(username,password)
# if username and password : #用户名和密码都不为空
# username=username.strip() #清除用户名前后的空格
if login_form.is_valid(): #这个就是用于验证输入表单内容的合法性
username=login_form.cleaned_data['username'] #cleaned_data会将input标签中的变量和值作为以字典的一个元素形式表现出来
password=login_form.cleaned_data['password']
# user = User(username, password) #添加到User表中
# user.save() #存储到数据库中
#查询数据库中是否存在该用户名和密码
t_username=User.objects.filter(name=username)
t_password=User.objects.filter(password=password)
if t_username and t_password:
return redirect('/index/')
elif not t_username:
# return HttpResponse('用户名不存在')
message='用户名不存在'
elif not t_password:
# return HttpResponse('密码不存在')
message='密码不存在'
return render(request,'login/login.html',{"message":message,"login_form":login_form}) #将message信息通过模板传递到网页
login_form=forms.UserForm() #保留输入的错误字段
return render(request,'login/login.html',{"login_form":login_form})
3.修改login.html文件
{% extends 'base.html' %} <!--继承base网页模板内容,可以浏览网页查看效果-->
{% load staticfiles %} <!--载入静态方法,用于加载static中的文件-->
{% block title %}登陆{% endblock %} <!--设置title,默认使用base模板中的-->
{% block css %}<link href="{% static 'css/login.css'%}" rel="stylesheet" />{% endblock %} <!--使用自定义的css登陆样式,不用base中的-->
{% block content %} <!--该模板语言用于定义主体内容,和模板中的结合使用-->
<div class="container">
<div class="col-md-4 col-md-offset-4">
<form class='form-login' action="/login/" method="POST">
{% if message %} <!--类似if语句-->
<div class="alert alert-warning">{{ message }}</div> <!--使用bootstrap的警示传递message信息-->
{% endif %}
{% csrf_token %}
<h2 class="text-center">欢迎登录</h2>
<div class="form-group">
{{ login_form.username.label_tag }}
{{ login_form.username}}
</div>
<div class="form-group">
{{ login_form.password.label_tag }}
{{ login_form.password }}
</div>
{# <div class="form-group">#}
{# <label for="id_username">用户名:</label>#}
{# <input type="text" name='username' class="form-control" id="id_username" placeholder="Username" autofocus required>#}
{# </div>#}
{# <div class="form-group">#}
{# <label for="id_password">密码:</label>#}
{# <input type="password" name='password' class="form-control" id="id_password" placeholder="Password" required>#}
{# </div>#}
<button type="reset" class="btn btn-default pull-left">重置</button>
<button type="submit" class="btn btn-primary pull-right">提交</button>
</form>
</div>
</div> <!-- /container -->
{% endblock %}