django-Ajax

Ajax

ajax不是一门新的技术并且有很多版本
我们目前的是jQuery版本(版本无所谓 本质一样就可以)

Ajax的特点:异步提交,局部刷新
基本语法:
	$.ajax({
        url:'',  // 后端地址 三种填写方式 与form标签的action一致
        type:'post',  // 请求方式 默认也是get
        data:{'v1':v1Val, 'v2':v2Val},  // 发送的数据
        success:function (args) {  // 后端返回结果之后自动触发 args接收后端返回的数据
         	 $('#d3').val(args)
                                }
    })

Content_Type

urlencoded
	ajax默认的编码格式、form表单默认也是
	数据格式 xxx=yyy&uuu=ooo&aaa=kkk
	django后端会自动处理到request.POST中
formdata
	django后端针对普通的键值对还是处理到request.POST中
	但是针对文件会处理到request.FILES中···
application/json
	form表单不支持 ajax可以
	<script>
    $('#d1').click(function () {
        $.ajax({
            url:'',
            type:'post',
            data:JSON.stringify({'name':'jason','age':18}),  // 千万不要骗人家
            contentType:'application/json',
            success:function (args) {
                alert(args)
            }

        })
    })
</script>
后端需要从request.body中获取并自己处理

ajax携带文件数据

<script>
    $('#d3').click(function () {
        // 1.先产生一个FormData对象
        let myFormDataObj = new FormData();
        // 2.往该对象中添加普通数据
        myFormDataObj.append('name', 'jason');
        myFormDataObj.append('age', 18);
        // 3.往该对象中添加文件数据
        myFormDataObj.append('file', $('#d2')[0].files[0])
        // 4.发送ajax请求
        $.ajax({
            url:'',
            type:'post',
            data:myFormDataObj,

            // ajax发送文件固定的两个配置
            contentType:false,
            processData:false,
            success:function (args){
                alert(args)
            }

        })
    })
</script>

Ajax补充说明:


1.后端request.is_ajax()
	用于判断当前请求是否由ajax发出
2.后端返回的三板斧都会被args接收不再影响整个浏览器页面
3.选择使用ajax做前后端交互的时候 后端一般返回的都是字典数据
	user_dict = {'code': 10000, 'username': '小阳人', 'hobby': '哎呦喂~'}

ajax自动反序列化后端的json格式的bytes类型数据
	dataType:'json',
	将这个参数添加到ajax的语法中即可
posted @ 2022-12-19 16:41  dd随风  阅读(12)  评论(0编辑  收藏  举报