ajax的基础语法、数据编码、回调函数、以及django序列化orm数据对象
Ajax
定义
ajax在不重新加载整个页面的情况下,就可以与服务器交换数据并更新部分网页的内容。真正的做到了局部刷新,异步提交。我们可以在很多功能上都可以用ajax替代掉form表单提交数据的方式,并且体验更好。
基础语法
$.ajax({
url:'', # 控制数据发送的路径,默认为页面显示的地址
type:'', # 控制请求方法,默认就是get请求
data:{}, # 组织提交的数据
success:function(形参){
#异步回调函数
}
})
数据编码格式(Content-Type)
urlencoded
是默认的传输数据格式,数据格式为:name=jason&pwd=123&hobby=read
在django后端同一处理到request.POST中
formdata
数据格式:无法查阅
django后端自动将文件数据处理到request.FILES(普通数据处理到request.POST)
application/json
数据格式:json格式
django后端不会处理,在request.body中存储(bytes类型),需要我们自己做反序列化
语法注意事项
data:stringify({'name':'jason','pwd':123})
contentType:'application/json'
ajax携带文件数据
$('#d5').click(function () {
// 产生内置对象
let formDate=new FormData()
// 添加普通数据,文件数据
formDate.append('username',$('#d1'))
formDate.append('file',$('#d4')[0].files[0])
// 发送ajax请求
$.ajax({
url:'',
type:'post',
data:formDate,
contentType:false, // 不使用任何数据格式
processData:false, // 不处理数据内容
success:function () {
// 回调函数
}
})
})
回调函数
后端跟ajax交互,不应该再返回页面,通常情况下都是返回json格式数据
前端针对HttpResponse和JsonResponse返回的json格式数据处理策略不同
HttpResponse
ajax接收其返回值的时候不会自动进行反序列化,需要我们自己用反序列化
# 视图函数
def view(request):
if request.method=='POST':
...
return HttpResponse({'name':'jason','age':20})
return render(request,'view.home')
ajax的回调函数会接受到bytes类型的数据,需要自己在回调函数中进行序列化
$.ajax({
url:'',
type:'',
data:{'xxx':'xxx'}
success:function (args) { // 参数为获取后端返回的值
// 回调函数
console.log(args)
let a=JSON.parse(args) // 反序列化
}
})
也可以加一个参数自动进行反序列化:
dataType:JSON
JsonResponse
数据传入回调函数中会被ajax自动进行反序列化。
序列化
定义
我们通过ORM获取到的结果集其实就是一个个用户对象,但当我们要将此数据以json格式发送给客户端的时候,就可以用Django给我们提供的序列化方式。
语法
from django.http import JsonResponse
def ajax(request):
if request.method=='POST':
# 获取书籍表的全部用户对象
book_list=models.Book.objects.all()
# 导入内置序列化模版
from django.core import serializers
# 调用该模块的serialize方法
book_dict=serializers.serialize('json',book_list)
print(book_dict)
return JsonResponse(book_dict,safe=False)
return render(request,'a_ajax.html')