使用Django表单替代html表单

it2022-05-28  71

使用Django表单替代html表单

1.根目录下创建forms模型

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 %}

转载于:https://www.cnblogs.com/endmoon/p/9744742.html

相关资源:数据结构—成绩单生成器

最新回复(0)