Django forms組件

校驗字段

模板文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<form action="" method="post"><p>用戶名: <input type="text" name="name"></p>
{#    <p>密碼: <input type="text" name="pwd"></p>#}<p>確認密碼: <input type="text" name="re_pwd"></p><p>郵箱: <input type="text" name="email"></p><input type="submit" value="提交"></form>
</body>
</html>

?視圖文件

from django import forms
from django.forms import widgets

class MyForm(forms.Form):
# 定義一個屬性,可以用來校驗字符串類型
# 限制最大長度是8,最小長度是3
name = forms.CharField(max_length=8, min_length=3, label='用戶名',
error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},)
pwd = forms.CharField(max_length=8, min_length=3, required=True, label='密碼',
error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},)
re_pwd = forms.CharField(max_length=8, min_length=3, required=True, label='確認密碼',
error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},)
# 校驗是否是郵箱格式
email = forms.EmailField(label='郵箱', error_messages={'required': '這個必須填', 'invalid': '不符合郵箱格式'})


數據從前端傳過來,校驗 要校驗的字典,可以多參數,但是不能少 def index_form(request):# 生成對象時(實例化),需要傳入要校驗的數據(字典)if request.method=='GET':return render(request,'indxe.html')elif request.method=='POST':print(request.POST)myform=MyForm(request.POST)# is_valid如果是true表示校驗成功,反之,校驗失敗if myform.is_valid():# 校驗通過的數據print(myform.cleaned_data)return HttpResponse('校驗成功')else:print(myform.cleaned_data)# 錯誤信息,它是一個字典print(myform.errors)print(myform.errors.as_data())print(type(myform.errors))from django.forms.utils import ErrorDictreturn HttpResponse('校驗失敗')

?渲染模板

視圖文件

from django.forms import widgets
from django.forms import widgets
from django.core.exceptions import ValidationErrorname = forms.CharField(widget=widgets.TextInput(attrs={'class': 'form-control'}))pwd = forms.CharField(widget=widgets.PasswordInput(attrs={'class': 'form-control'}))widgets 就是用來渲染的class MyForm(forms.Form):# 定義一個屬性,可以用來校驗字符串類型# 限制最大長度是8,最小長度是3name = forms.CharField(max_length=8, min_length=3, label='用戶名',error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},widget=widgets.TextInput(attrs={'class': 'form-control'}))pwd = forms.CharField(max_length=8, min_length=3, required=True, label='密碼',error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},widget=widgets.PasswordInput())re_pwd = forms.CharField(max_length=8, min_length=3, required=True, label='確認密碼',error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},widget=widgets.PasswordInput())# 校驗是否是郵箱格式email = forms.EmailField(label='郵箱', error_messages={'required': '這個必須填', 'invalid': '不符合郵箱格式'})渲染模板
def index_form(request):# 生成對象時(實例化),需要傳入要校驗的數據(字典)myform=MyForm()if request.method=='GET':return render(request,'indxe2.html',locals())

?模板文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<hr>
<h1>第一種方式</h1>
<form action="" method="post" ><p>用戶名: {{ myform.name }}</p><p>密碼: {{ myform.pwd }}</p><p>郵箱: {{ myform.email }}</p><input type="submit" value="提交"></form>
<hr>
<h1>第二種方式(for循環form對象,建議用這種)</h1>
<form action="" method="post" >{% for foo in myform %}<p>{{ foo.label }}:{{ foo }}</p>{% endfor %}<input type="submit" value="提交">
</form>
<h1>第三種方式(不建議用)</h1>
<form action="" method="post" >{#    {{ myform.as_p }}#}{{ myform.as_ul }}<input type="submit" value="提交">
</form>
</body>
</html>

?渲染錯誤信息

視圖文件

# 第一步:先要繼承Form
from django import forms
from django.forms import widgets
from django.core.exceptions import ValidationError# 寫一個類
class MyForm(forms.Form):# 定義一個屬性,可以用來校驗字符串類型# 限制最大長度是8,最小長度是3name = forms.CharField(max_length=8, min_length=3, label='用戶名',error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},widget=widgets.TextInput(attrs={'class': 'form-control'}))pwd = forms.CharField(max_length=8, min_length=3, required=True, label='密碼',error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},widget=widgets.PasswordInput())re_pwd = forms.CharField(max_length=8, min_length=3, required=True, label='確認密碼',error_messages={'max_length': '最長是8', 'min_length': '最短是3', 'required': '這個必須填'},widget=widgets.PasswordInput())# 校驗是否是郵箱格式email = forms.EmailField(label='郵箱', error_messages={'required': '這個必須填', 'invalid': '不符合郵箱格式'})# aa = forms.CharField(label='選擇', error_messages={'required': '這個必須填', 'invalid': '不符合郵箱格式'},widget=widgets.CheckboxInput())def clean_name(self):# self:當前form對象name = self.cleaned_data.get('name')if name.startswith('sb'):# 失敗,拋異常raise ValidationError('不能以傻逼開頭')# 正常,把name返回return namedef clean(self):pwd=self.cleaned_data.get('pwd')re_pwd=self.cleaned_data.get('re_pwd')if pwd==re_pwd:return self.cleaned_dataelse:raise ValidationError('兩次密碼不一致')# 渲染錯誤信息
from app01 import models
def index_form(request):# 生成對象時(實例化),需要傳入要校驗的數據(字典)if request.method == 'GET':myform = MyForm()elif request.method == 'POST':myform = MyForm(request.POST)if myform.is_valid():print(myform.cleaned_data)myform.cleaned_data.pop('re_pwd')models.User.objects.create(**myform.cleaned_data)return redirect('http://www.baidu.com')else:all_error = myform.errors.get('__all__')if all_error:all_error=all_error[0]return render(request, 'indxe3.html', locals())

?模板文件

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css"><title>Title</title>
</head>
<body><h1>第二種方式(for循環form對象,建議用這種)</h1>
<form action="" method="post" novalidate>{% for foo in myform %}<p>{{ foo.label }}:{{ foo }} <span>{{ foo.errors.0 }}</span></p>{% endfor %}<input type="submit" value="提交"><span>{{ all_error }}</span>
</form>
</body>
</html>errors存放著錯誤信息

?局部鉤子

    def clean_name(self):# self:當前form對象name = self.cleaned_data.get('name')if name.startswith('sb'):# 失敗,拋異常raise ValidationError('不能以傻逼開頭')# 正常,把name返回return nameclean_name  是拿上面定義的name 返回的信息也是放到 errors字典內 鍵是name 對應的值內

?全局鉤子

    def clean(self):pwd=self.cleaned_data.get('pwd')re_pwd=self.cleaned_data.get('re_pwd')if pwd==re_pwd:return self.cleaned_dataelse:raise ValidationError('兩次密碼不一致')全局鉤子  錯誤的信息存放在 errors 字典內的 __all__ 鍵對應的值內

?

from django.shortcuts import render,HttpResponse
import json
from django.http import JsonResponse
# Create your views here.
from django import forms
from django.forms import widgets
from django.core.exceptions import ValidationError
from app01 import modelsclass myForm(forms.Form):name = forms.CharField(max_length=12, min_length=3, label='用戶名',error_messages={'max_length': '最長是12', 'min_length': '最短是3', 'required': '必填'},widget=widgets.TextInput(attrs={'class': 'form-control','id':'usr'}))pwd = forms.CharField(max_length=16, min_length=3, label='密碼',error_messages={'max_length': '最長16', 'min_length': '最短是3', 'required': '必填'},widget=widgets.PasswordInput(attrs={'class': 'form-control','id':'pwd'}))re_pwd = forms.CharField(max_length=16, min_length=3, label='再次輸入密碼',error_messages={'max_length': '最長16', 'min_length': '最短是3', 'required': '必填'},widget=widgets.PasswordInput(attrs={'class': 'form-control','id':'pwd2'}))email = forms.EmailField(label='郵箱',error_messages={'required': '必填', 'invalid': '不符合郵箱格式'},widget=widgets.EmailInput(attrs={'class': 'form-control','id':'email'}))def clean_name(self):name=self.cleaned_data.get("name")# print(name)account=models.User.objects.filter(name=name).first()if account:raise ValidationError('該用戶名已存在')return namedef clean(self):pwd = self.cleaned_data.get('pwd')# print(pwd)re_pwd = self.cleaned_data.get('re_pwd')if pwd == re_pwd:return self.cleaned_dataelse:raise ValidationError('兩次密碼不一致')def index(request):if request.method == 'GET':myform = myForm()return render(request, 'index.html', locals())elif request.method == 'POST':# print(request.POST)# print(request.body)ajax1=json.loads(request.body.decode('utf-8'))# print(ajax1)myform = myForm(ajax1)if myform.is_valid():data = myform.cleaned_datadata.pop('re_pwd')models.User.objects.create(**data)return HttpResponse('注冊成功')else:return JsonResponse(myform.errors)def index_usr(request):print(request.body)ajax2 = json.loads(request.body.decode('utf-8'))print(ajax2)myform = myForm(ajax2)if myform.is_valid():return HttpResponse(json.dumps('可以使用的用戶名'))else:return JsonResponse(myform.errors)
注冊功能頁面(手擼)views層
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.css"><title>Title</title>
</head>
<body>
<div class="container-fluid"><div class="row"><div class="col-md-6 col-md-offset-3" id="msg"><form action="" method="post" novalidate>{% for foo in myform %}<p id="{{ foo.auto_id }}">{{ foo.label }}:{{ foo }}</p>{% endfor %}</form><button type="submit" id="btn">注冊</button><span id="error"></span></div></div>
</div></body>
<script src="/static/jquery-3.3.1.js"></script>
<script src="/static/bootstrap-3.3.7-dist/js/bootstrap.js"></script>
<script>$('#btn').click(function () {var pos_data = {'name': $('#usr').val(),'pwd': $('#pwd').val(),'re_pwd': $('#pwd2').val(),'email': $('#email').val()};var pos = JSON.stringify(pos_data);$.ajax({url: '/index/',type: 'post',data: pos,contentType: 'application/json',dataType: 'json',success: function (data) {for (let i in data) {var error_msg2 = $('<span class="pull-right" style="color: red" id="msg_error" >' + data[i] + '</span>');if (error_msg2) {$('#msg_error').remove()}$('#id_' + i + '').append(error_msg2);if (data['__all__']) {var error_msg = $('<span class="pull-right" style="color: red" id="er_pwd2">' + data['__all__'] + '</span>');if ($('#er_pwd2')) {$('#msg_error').remove()$('#er_pwd2').remove()}$('#id_re_pwd').append(error_msg)} else {$('#er_pwd2').remove()}break;}alert(data)}})});$('#usr').on('blur', function () {var pos_data2 = {'name': $('#usr').val(),};var pos2 = JSON.stringify(pos_data2);$.ajax({url: '/index_usr/',type: 'post',data: pos2,contentType: 'application/json',dataType: 'json',success: function (data) {console.log(data)li='name'if (li in data) {var error_msg2 = $('<span class="pull-right" style="color: red" id="msg_error" >' + data['name'] + '</span>');if (error_msg2) {$('#msg_error').remove()}$('#id_name').append(error_msg2);}else {var error_msg2 = $('<span class="pull-right" style="color: red" id="msg_error" >可以使用的用戶名 </span>');if (error_msg2) {$('#msg_error').remove()}$('#id_name').append(error_msg2);}}})})
</script>
</html>
注冊功能頁面(手擼) index.html
from django.db import models# Create your models here.
class User(models.Model):name=models.CharField(max_length=32)pwd=models.CharField(max_length=32)email=models.EmailField()
models.py

?

轉載于:https://www.cnblogs.com/layerluo/p/9998524.html

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/248967.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/248967.shtml
英文地址,請注明出處:http://en.pswp.cn/news/248967.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

為什么要用TypeScript - 肉豬 - 博客園

為什么要用TypeScript 以下是本人的一點拙見&#xff0c;歡迎指正。 TypeScript的設計目的應該是解決JavaScript的“痛點”&#xff1a;弱類型和沒有命名空間&#xff0c;導致很難模塊化&#xff0c;不適合開發大型程序。另外它還提供了一些語法糖來幫助大家更方便地實踐面向…

java繼承上機作業

實現如下類之間的繼承關系&#xff0c;并編寫Music類來測試這些類。 1 package su;2 3 class Instrument{4 public void play() {5 System.out.println("彈奏樂器");6 }7 8 public void play2() {9 // TODO 自動生成的方法存根 10 …

自定義標簽的作用

1&#xff09;控制標簽體內容是否輸出 2&#xff09;控制標簽余下內容是否輸出 3&#xff09;控制重復輸出標簽體內容 4&#xff09;改變標簽體內容 5&#xff09;帶屬性的標簽 package com.loaderman.demo.a_tag;import java.io.IOException; import java.io.StringWriter;imp…

前端之模擬數據 - HackerVirus - 博客園

閱讀目錄 玩轉前端之模擬數據 回到目錄 玩轉前端之模擬數據 博客園主頁&#xff1a;http://www.cnblogs.com/handoing/ 是否還在為前端模擬數據頭疼&#xff1f; 是否還在為后端返回數據格式較多內心煩躁&#xff1f; 是否還想吸一支煙壓壓精&#xff1f; 看下去吧&#x…

Leetcode No.146 ****

運用你所掌握的數據結構&#xff0c;設計和實現一個 LRU (最近最少使用) 緩存機制。它應該支持以下操作&#xff1a; 獲取數據 get 和 寫入數據 put 。 獲取數據 get(key) - 如果密鑰 (key) 存在于緩存中&#xff0c;則獲取密鑰的值&#xff08;總是正數&#xff09;&#xff…

三元運算符運算(Day02)

三元運算符運算(Day02) 運算符&#xff1a;用來對常量或者變量連接的符號&#xff0c;稱為運算符。表達式&#xff1a;用運算符連接起來的整個式子成為表達式。比如&#xff1a;a10,1020運算符有以下五種&#xff1a;1、算術運算符2、賦值運算符3、關系運算符4、邏輯運算符5、三…

JS正則表達式驗證數字非常全 - 吾心無所 - 博客園

JS正則表達式驗證數字非常全 Js代碼 <script type"text/javascript"> function SubmitCk() { var reg /^([a-zA-Z0-9][_|\_|\.]?)*[a-zA-Z0-9]([a-zA-Z0-9][_|\_|\.]?)*[a-zA-Z0-9]\.[a-zA-Z]{2,3}$/; if (!reg.test($("#txtEmail").val())) {…

datagrid 的標題的內容不對應整齊

$(document).ready(function(){ var column "[[" "{title:工號,field:grantorCode,sortable:true,hidden:true,width:fixWidth(0)}," "{title:外出告知人,field:grantor,sortable:true,width:fixWidth(0.15)}," "{title:開始時間…

laravel 分頁

2.1 基于查詢構建器分頁 有多種方式實現分頁&#xff0c;最簡單的方式就是使用查詢構建器或Eloquent模型的paginate方法。該方法基于當前用戶查看頁自動設置合適的偏移&#xff08;offset&#xff09;和限制&#xff08;limit&#xff09;。默認情況下&#xff0c;當前頁通過HT…

Postfix常用命令和郵件隊列管理(queue)

本文主要介紹一下postfix的常用命令及郵件隊列的管理: Postfix有以下四種郵件隊列&#xff0c;均由管理隊列的進程統一進行管理&#xff1a; maildrop&#xff1a;本地郵件放置在maildrop中&#xff0c;同時也被拷貝到incoming中。 incoming&#xff1a;放置正在到達隊列或管理…

異步加載js文件并執行js方法:實現異步處理網頁的復雜效果

異步加載js文件并執行js方法&#xff1a;實現異步處理網頁的復雜效果 有這么一個場景&#xff0c;當你的網頁頁面效果過多就會造成了打開頁面的速度變得緩慢&#xff0c;長時間處于加載的狀態&#xff0c;這樣的效果通常會讓用戶感到不友好&#xff0c;通常的處理方法是先…

1.java的基礎和數據類型

一.學習要求1.聽課一定要全神貫注2.課堂筆記&#xff0c;一定要自己總結&#xff0c;而且要有很嚴謹的邏輯關系。提綱很重要3.作業不折不扣的完成&#xff0c;并且多完成4.階段項目一定要獨立完成5.每天早上由一位同學來進行早分享&#xff0c;內容可以是昨天或者明天的學習內容…

JavaScript DOM操作 提高篇

做為一個web前端&#xff0c;處理和了解瀏覽器差異一個重要問題.下面將介紹本人在工作中的一些筆記總結&#xff0c;先介紹沒有使用js庫的情況。 1.  setAttribute方法設置元素類名 &#xff1a; 在jQuery中&#xff0c;直接使用attr()方法即可&#xff0c;可在原生的JS中 e…

《算法競賽進階指南》0.5排序

103. 電影 莫斯科正在舉辦一個大型國際會議&#xff0c;有n個來自不同國家的科學家參會。 每個科學家都只懂得一種語言。 為了方便起見&#xff0c;我們把世界上的所有語言用1到109之間的整數編號。 在會議結束后&#xff0c;所有的科學家決定一起去看場電影放松一下。 他們去的…

Spring Cloud Gateway(五):路由定位器 RouteLocator

本文基于 spring cloud gateway 2.0.1 1、簡介 直接 獲取 路 由 的 方法 是 通過 RouteLocator 接口 獲取。 同樣&#xff0c; 該 頂 級 接口 有多 個 實現 類&#xff0c; RouteLocator 路由定位器&#xff0c;顧名思義就是用來獲取路由的方法。該路由定位器為頂級接口有多個實…

CommonJS,AMD,CMD區別 - 鄭星陽 - ITeye博客

CommonJS&#xff0c;AMD&#xff0c;CMD區別 博客分類&#xff1a; seajs和requirejs JavaScript zccst轉載 學得比較暈&#xff0c;再次看commonjs&#xff0c;amd, cmd時好像還是沒完全弄清楚&#xff0c;今天再整理一下&#xff1a; commonjs是用在服務器端的&#xff…

739. Daily Temperatures

根據每日 氣溫 列表&#xff0c;請重新生成一個列表&#xff0c;對應位置的輸入是你需要再等待多久溫度才會升高的天數。如果之后都不會升高&#xff0c;請輸入 0 來代替。 例如&#xff0c;給定一個列表 temperatures [73, 74, 75, 71, 69, 72, 76, 73]&#xff0c;你的輸出應…

【NOIP2018】DAY2T2——填數游戲(輪廓線狀壓的dp?搜索打表)

描述 小 D 特別喜歡玩游戲。這一天&#xff0c;他在玩一款填數游戲。 這個填數游戲的棋盤是一個n m的矩形表格。玩家需要在表格的每個格子中填入一個數字&#xff08;數字 0 或者數字 1&#xff09;&#xff0c;填數時需要滿足一些限制。 下面我們來具體描述這些限制。 為了方…

Mysql中遇到的錯誤

Caused by: java.sql.SQLException: Unknown system variable ‘tx_isolation’ 這種錯誤是因為數據庫版本新的但是mysql的jar包是舊的&#xff0c;所以導入最新的mysqljar包 注意實體類和數據庫字段的映射關系&#xff0c;實體類中使用駝峰式的命名規則&#xff0c;大寫的字母…

Express 入門之Router - worldtree_keeper的專欄 - CSDN博客

要了解Router我們需要先知道到Application&#xff0c;首先&#xff0c;每一個express實例本身內部就內建了router&#xff0c;所以我們先從簡單的下手&#xff0c;先使用application&#xff1b;另外這里我們只選擇get方法&#xff0c;作為我們Router.Method, 之所以使用get是…