django ajax
目录
MTV与MVC(了解)
MTV模型
M：模型层 (models.py)
T：templates
V：views
MVC模型：
M：模型层(models.py)
V：视图层(views.py)
C：控制器(Controller) url.py
本质：django的MTV也是MVC
多对多三种创建方式
# 第一种 django orm自动帮我们创建
class Book(models.Model):
name = models.CharField(max_length=32)
authors = models.ManyToManyField(to="Author")
class Author(models.Model):
name = models.CharField(max_length=32)
# 第二种 纯手动创建第三张表(不可使用orm查询操作)
class Book(models.Model):
name = models.CharField(max_length=32)
class Author(models.Model):
name = models.CharField(max_length=32)
class Book2Author(models.Model):
book = models.ForeignKey(to="Book")
author = models.ForeignKey(to="Author")
info = models.CharField(max_length=32) # 手动建第三张表时可创建额外的字段
# 第三种 半自动创建第三种表(可扩展性高，并且能够符合orm查询)
class Book(models.Model):
name = models.Charfield(max_length=32)
authors = models.ManyToManyField(to="Author",through="Book2Author", through_fields=("book", "author"))
class Author(models.Model):
name = model.CharField(max_length=32)
book = models.ManyToManyField(to="Book",through="Book2Author",through_fields=("author","book"))
class Book2Author(models.Model):
book = models.ForeignField(to="Book")
author = models.ForeignField(to="Author")
info = models.CharField(max_length=32)
前后端传输数据的编码格式(contentType)
urlencoded
对应的数据格式：
name=jason&password=123
后端获取数据方法：
request.POST
ps:django会将urlencoded编码的数据解析，然后自动放到request.POST中
formdata
form表单传输文件的编码格式
后端获取文件格式数据：
request.FILES
后端获取普通键值对数据：
request.POST
application/json
ajax发送json数据的编码格式
需要注意的是，编码的数据也必须符合json的规范(字典，双引号...)
ajax
前端朝后端发送请求的方式
浏览器窗口手动输入网址 # get请求
a标签href属性 # get请求
form表单 # get/post请求 默认为get请求
ajax # get/post请求
ajax的特点
异步提交
局部刷新
ajax基本语法
# ajax提交数据必备的几个参数
1、往哪里提交 url控制
2、提交方式 type控制
3、提交后的数据 data
4、提交后端数据之后的结果 success:function(){}
<script>
$("#d1").click(function () {
$ajax({
// 提交的地址
url:"/index/",
// 提交的方式
type:"post",
// 提交的内容
data:{"name":"jason","password":"123"},
// 回调函数
success:function (data) { // data接收的就是异步提交后返回的结果
alert(data)
}
})
});
</script>
ajax默认传输数据的格式也是urlencoded
前后端传输数据，前端要标识出数据的格式
<script>
$("#d1").click(function () {
$ajax({
url:"/index/",
contentType:"aplication/json" // 标识出数据的格式
type:"post",
data:{"name":"jason","password":"123"},
success:function(data) {
alert(data)
}
})
});
</script>
ajax提交JSON格式数据
1、需要告诉后端此次发送的数据为JSON格式
2、告诉后端数据是什么格式，你在传的时候，数据就应该对应是什么格式
<script>
$("#d1").click(function(){
$ajax({
// 前面的变量都是固定写法，url，type，data
url:'', // 提交的路径
type:'post', // 提交的方式
data:JSON.stringify({"name":"egon", "age":"18"}), // 提交的数据
contentType:"applation/json", // 告诉后端当前数据的格式为json格式 # 编码格式与数据类型必须一致，不能骗人！
success:function(data){ // 回调函数，会将后端处理好的数据传给data形参
alert(data);
}
})
});
</script>
request.POST 只能解析 编码格式为urlencoded以及text/plain的数据
ajax传输文件
// 必须注意的几个点：
1、必须用内置对象： new FormData
2、获取input框文件对象: $("$i1")[0].files[0]
3、设置两个参数为false
processData:false, // 告诉后端不要处理我的数据
contentType:false, // 告诉后端不要指定任何编码，就按照我的formdata内部的数据格式解析即可
4、后端按正常的文件上传，从request.FILES里面获取文件对象
5、formdata也支持传普通的键值对，后端仍然可以在request.POST里面获取到
前端代码：
<script>
$("#d1").click(function () {
let formdata = new FormData();
// FormData对象不仅仅可以传文件，还可以传普通的键值对
formdata.append("name","jason");
// 获取input框存放的文件
// $("#i1")[0].files[0] 固定写法，获取到文件对象
formdata.append("myfile",$("#i1")[0].files[0]);
$ajax({
url:"",
type:"post",
data:formdata,
// ajax发送文件需要修改两个固定的参数
processData:false, // 告诉浏览器不要处理我的数据
contentType:false, // 不用用任何的编码，就用我formdata自带的编码格式，django能够自动识别该formdata对象
// 回调函数
success:function (data) {
alert(data)
}
})
});
</script>
后端代码
def add_files(request):
if request.method == "POST":
file_obj = request.FILES.get("myfile")
with open(file_obj.name,"wb") as f:
for line in file_obj:
f.write(line)
return HttpResponse("OK")
return render(request, "add_files.html")
form表单与ajax异同点
1、form表单不支持异步提交，局部刷新
2、form表单不支持传输json格式的数据
3、from表单与ajax默认传输数据的编码格式都是urlencoded
批量插入数据
l = []
for i in range(100000):
l.append(models.Book(name="第%s本书" % i))
models.Book.objects.bulk_create(l) # 批量插入数据
补充
<li><a> href="?page=1"</a></li> <!--href中可以只填路径后缀后的内容，前面会自动补全的-->
自定义分页器
自定义分页器页码的渲染通常都是单数，符合审美
需要完善的点：
1、加上 首页/尾页
2、页码的个数得是固定的
自定义分页器的使用
后端
# 后端
book_list = models.Book.objects.all()
# 数据总条数
all_count = book_list.count()
# 当前页
current_page = request.GET.get("page",1)
# 实例一个分页器对象
page_obj = my_pags.Pagination(current_page=current_page,all_count=all_count)
# 对总数据进行切片
page_queryset = book_list[page_obj.start:page_obj.end]
前端
{{ page_obj.page_html|safe }} # 帮你渲染的是带有bootstrap样式的分页器
