需求
from表單驗證和ajax驗證時返回的錯誤信息處理
速查
1、form表單提交時錯誤信息顯示
views
|
1
2
|
error
=
form表單實例化對象.errors
return
render(request,
'前端html'
,{
'obj'
:form表單實例化對象,
'error'
:error})
#傳到前端用simple_tag解析
|
html
|
1
2
|
{% load xx %}
<!--導入自定義sample_tag語言文件-->
<
span
>{% error_msg error.username %}</
span
>
<!--error.username當做參數傳給error_msg函數，並獲取返回值-->
|
simple_tag
|
1
2
3
4
5
|
@register
.simple_tag
def
error_msg(error_list):
if
error_list:
return
error_list[
0
]
return
''
|
2、ajax提交時錯誤信息返回
views
|
1
2
|
error
=
obj.errors.as_json()
return
HttpResponse(error)
|
html
|
1
2
3
4
5
6
|
$.ajax({
success: function(arg){ //arg是返回值，必須是字符串
var callback_dict = $.parseJSON(arg);
$('#uname_error').text(callback_dict.username[0].message);
}
})
|
知識點
obj=表單生成文件.表單創建的類（request.POST）
request.POST：所有提交信息
obj.is_valid()：判斷提交數據是否正確
obj.clean()：獲取提交的所有數據
obj.errors()：獲取提交的所有錯誤信息，有三種表示方式（as_ul、as_json、as_data）：
form表單提交用默認的，type<class django.forms.utils.ErrorDict>
ajax返回信息用as_json()，type<'str'>
錯誤信息里包含的字段和form里的字段一樣，錯誤是個列表，取值obj.errors['username'][0]
html中jinja2語法取字典是不能用errors['key']的方式，得用errors.key;如果獲取obj.errors['username'][0]，就得用sample_tag
詳細
1、form表單提交時錯誤信息顯示
app01/views/account.py
|
1
2
3
4
5
6
7
8
9
10
11
|
from
app01.forms
import
account as AccountForm
def
login(request):
obj
=
AccountForm.LoginForm(request.POST)
if
request.method
=
=
'POST'
:
if
obj.is_valid():
all_data
=
obj.clean()
else
:
error
=
obj.errors
return
render(request,
'account/login.html'
,{
'obj'
:obj,
'error'
:error})
return
render(request,
'account/login.html'
,{
'obj'
:obj})
|
為什么使用sample_tag去取值，而不取好了再傳到html，因為如果字段很多的話，要分別定義每個的錯誤；
templates/login.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
{% load xx %}
<!--導入自定義sample_tag語言文件-->
<
html
lang
=
"en"
>
<
head
></
head
>
<
body
>
<
form
action
=
"/login/"
method
=
"post"
>
<
p
>
{{ obj.username }}
<
span
>{% error_msg error.username %}</
span
>
<!--error.username當做參數傳給error_msg函數，並獲取返回值-->
</
p
>
<
p
>
{{ obj.password }}<
span
>{% error_msg error.password %}</
span
>
</
p
>
<
input
type
=
"submit"
value
=
"submit"
/>
</
form
>
</
body
>
</
html
>
|
app01/templatetags/xx.py
|
1
2
3
4
5
6
7
8
9
10
|
from
django
import
template
from
django.utils.safestring
import
mark_safe
from
django.template.base
import
resolve_variable, Node, TemplateSyntaxError
register
=
template.Library()
@register
.simple_tag
def
error_msg(error_list):
if
error_list:
return
error_list[
0
]
|
browser
2、ajax提交時錯誤信息返回
ajax必須返回的是字符串，所以用as_json()格式。
先看as_json獲取的信息格式
|
1
2
3
4
5
6
7
8
|
{
"username"
: [
{
"message"
:
"This field is required."
,
"code"
:
"required"
}
],
"password"
: [
{
"message"
:
"This field is required."
,
"code"
:
"required"
}
]
}
|
app01/views/account.py
|
1
2
3
4
5
6
7
8
9
10
11
|
from
app01.forms
import
account as AccountForm
def
login(request):
obj
=
AccountForm.LoginForm(request.POST)
if
request.method
=
=
'POST'
:
if
obj.is_valid():
all_data
=
obj.clean()
else
:
error
=
obj.errors.as_json()
return
HttpResponse(error)
return
render(request,
'account/login.html'
,{
'obj'
:obj})
|
templates/login.html
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
<
form
action
=
"/login/"
method
=
"post"
>
<
p
>
{{ obj.username }}
<
span
id
=
"uname_error"
></
span
>
</
p
>
<
p
>
{{ obj.password }}
<
span
id
=
"pwd_error"
></
span
>
</
p
>
{# <
input
type
=
"submit"
value
=
"submit"
/>#}
<
input
type
=
"button"
value
=
"AjaxSubmit"
onclick
=
"AjaxSubmit();"
/>
</
form
>
<
script
src
=
"{{ STATIC_URL }}js/jquery-2.1.4.min.js"
></
script
>
<
script
type
=
"text/javascript"
>
function AjaxSubmit(){
$.ajax({
url: '/login/',
type: 'POST',
data: {'username':'','password':''}, //就當提交了一個空數據，制造錯誤
success: function(arg){ //arg是返回值，必須是字符串
var callback_dict = $.parseJSON(arg);
$('#uname_error').text(callback_dict.username[0].message);
$('#pwd_error').text(callback_dict.password[0].message);
{# console.log(callback_dict.username[0].message)#}
}
})
}
</
script
>
|
app01/forms/account.py
|
1
2
3
4
5
|
from
django
import
forms
class
LoginForm(forms.Form):
username
=
forms.CharField()
password
=
forms.CharField(widget
=
forms.PasswordInput())
|
browser
