django使⽤Ajax⽅式POSTJSON数据包
⽰例1:jquery实现ajax
js:
function SaveAction(){
//点击保存按键
var senddata = {"type":"A", "host":"www", "resolution_line":"0", "data":"172.16.2.3", "mx":"5", "ttl":"600"}
$.ajax({
url: "/dns/add.html",
type: "POST",        //请求类型
data: {"data":senddata},
dataType: "json",  // 这⾥指定了 dateType 为json后,服务端响应的内容为json.dumps(date),下⾯ succe
ss 的callback 数据⽆需进⾏JSON.parse(callback),已经是⼀个对象了,如果没有指定dateType则需要执⾏ JSON.parse(callback)        success: function (callback) {
//当请求执⾏完成后,⾃动调⽤
//callback, 服务器返回的数据
console.log(callback);
},
error: function () {
//当请求错误之后,⾃动调⽤
}
});
}
django 后台 view:
def record_add(req):
"""
添加解析记录
:param req:
:return:
"""
hod == 'POST':
type = ('data[type]')
host = ('data[host]')
resolution_line = ('data[resolution_line]')
data = ('data[data]')
mx = ('data[mx]')
ttl = ('data[ttl]')
print(type, host, resolution_line, data, mx, ttl)
return HttpResponse('hehe')
else:
return HttpResponse('use POST request method please.')
⽰例2:
JS
function SaveAction(){
//点击保存按键
var _type = $(".modal-body select[name=type]").val();
var _host = $(".modal-body input[name=host]").val();
var _resolution_line = $(".modal-body select[name=resolution_line]").val();
var _data = $(".modal-body input[name=data]").val();
var _mx = $(".modal-body input[name=mx]").val();
var _ttl = $(".modal-body select[name=ttl]").val();
var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }
$.ajax({
url: "/dns/add.html",
type: "POST",        //请求类型
//contentType: "application/json; charset=utf-8",
data: senddata,
dataType: "json",
success: function (callback) {
//当请求执⾏完成后,⾃动调⽤
//arg, 服务器返回的数据
console.log(callback);
},
error: function () {
//当请求错误之后,⾃动调⽤
}
});
}
django view
def record_add(req):
"""
添加解析记录
:param req:
:return:
"""
hod == 'POST':
type = ('type')
host = ('host')
resolution_line = ('resolution_line')
data = ('data')
mx = ('mx')
ttl = ('ttl')
print(type, host, resolution_line, data, mx, ttl)
return HttpResponse('hehe')
else:
return HttpResponse('use POST request method please.')
⽰例3:
js
function SaveAction(){
//点击保存按键
var _type = $(".modal-body select[name=type]").val();
var _host = $(".modal-body input[name=host]").val();
var _resolution_line = $(".modal-body select[name=resolution_line]").val();
var _data = $(".modal-body input[name=data]").val();
var _mx = $(".modal-body input[name=mx]").val();
var _ttl = $(".modal-body select[name=ttl]").val();
var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }    $.post("/dns/add.html", {'data':JSON.stringify(senddata)},function(callback){
JSON.parse(callback);
});
}
$.post 源码:
jQuery.each( [ "get", "post" ], function( i, method ) {
jQuery[ method ] = function( url, data, callback, type ) {
// shift arguments if data argument was omitted
if ( jQuery.isFunction( data ) ) {
type = type || callback;
callback = data;
data = undefined;
}
return jQuery.ajax({
url: url,
type: method,
dataType: type,
data: data,
success: callback
});
};
});
django view
def record_add(req):
"""
添加解析记录
:param req:
:return:
"""
hod == 'POST':
data = ('data')    # str: {"type":"A","host":"www","resolution_line":"0","data":"172.16.2.3","mx":"5","ttl":"600"}
data = json.loads(data)  # 字典:{'resolution_line': '0', 'data': '172.16.2.3', 'host': 'www', 'mx': '5', 'ttl': '600', 'type': 'A'}return HttpResponse('hehe') else:
return HttpResponse('use POST request method please.')
⽰例4
js $.ajax post提交 json数据
function SaveAction(){
//点击保存按键
var _type = $(".modal-body select[name=type]").val();
var _host = $(".modal-body input[name=host]").val();
var _resolution_line = $(".modal-body select[name=resolution_line]").val();
var _data = $(".modal-body input[name=data]").val();
var _mx = $(".modal-body input[name=mx]").val();
var _ttl = $(".modal-body select[name=ttl]").val();
var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }
$.ajax({
url: "/dns/add.html",
type: "POST",        //请求类型
contentType: "application/json; charset=utf-8",
data: JSON.stringify(senddata),
dataType: "json",
success: function (callback) {
//当请求执⾏完成后,⾃动调⽤
//arg, 服务器返回的数据
console.log(callback);
},
error: function () {
/
/当请求错误之后,⾃动调⽤
}
});
}
django view
import json
def record_add(req):
"""
添加解析记录
:param req:
:return:
"""
hod == 'POST':
body_data = req.body    # 获取http请求体数据
print(body_data)        # b'{"type":"A","host":"www","resolution_line":"0","data":"172.16.2.3","mx":"5","ttl":"600"}' print(type(body_data))    # <class 'bytes'>
body_data_str = str(body_data, encoding="utf8")    # bytes 转 str
data = json.loads(body_data_str)
print(data['type'])
return HttpResponse('hehe')
else:
return HttpResponse('use POST request method please.')
⽰例5:
建议使⽤这种⽅式
js
function SaveAction(){
//点击保存按键
var _type = $(".modal-body select[name=type]").val();
var _host = $(".modal-body input[name=host]").val();
var _resolution_line = $(".modal-body select[name=resolution_line]").val();
var _data = $(".modal-body input[name=data]").val();
var _mx = $(".modal-body input[name=mx]").val();
var _ttl = $(".modal-body select[name=ttl]").val();
var senddata = {"type":_type, "host":_host, "resolution_line":_resolution_line, "data":_data, "mx":_mx, "ttl":_ttl }    $.ajax({
url: "/dns/add.html",
type: "POST",        //请求类型
data: {'data': JSON.stringify(senddata)},
dataType: "json",
success: function (callback) {
//当请求执⾏完成后,⾃动调⽤
//arg, 服务器返回的数据
console.log(callback);
},
error: function () {
//当请求错误之后,⾃动调⽤
}
});
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。