多对多建表，AJAX及分页器

多对多关系建表的三种方式

1.第一种 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)

2.第二种纯手动创建第三张表

	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)

3.第三种半自动创建第三张表

可扩展性高，并且能够符合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 = models.CharField(max_length=32)
		# book = models.ManyToManyField(to='Book',through='Book2Author',through_fields=('author','book'))
        
    class Book2Author(models.Model):
		book = models.ForeignKey(to='Book')
		author = models.ForeignKey(to='Author')
		info = models.CharField(max_length=32)

前后端传输数据编码格式contentType

urlencoded
	对应的数据格式:name=jason&password=666
	后端获取数据:request.POST
	ps；django会将urlencoded编码的数据解析自动放到request.POST
formdata
	form表单传输文件的编码格式
	后端获取文件格式数据:request.FILES
	后端获取普通键值对数据:request.POST
application/json
	ajax发送json格式数据
	需要注意的点
		编码与数据格式要一致

ajax请求

AJAX（Asynchronous Javascript And XML）翻译成中文就是“异步的Javascript和XML”。即使用Javascript语言与服务器进行异步交互，传输的数据为XML（当然，传输的数据不只是XML）。

AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。

AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。

• 同步交互：客户端发出一个请求后，需要等待服务器响应结束后，才能发出第二个请求；
• 异步交互：客户端发出一个请求后，无需等待服务器响应结束，就可以发出第二个请求。

1.前端向后端发请求的几种方式

  浏览器窗口手动输入网址         get请求
  a标签的href属性				get请求
  form表单					  get/post请求(默认是get请求)
  ajax				   		get/post请求

2.ajax基本语法

提交的地址(url)
提交的方式(type)
提交的数据(data)
回调函数(success)

ajax默认传输数据的编码格式也是urlencoded

			$('#d1').click(function () {
					$.ajax({
						// 提交的地址
						url:'/index/',
						// 提交的方式
						type:'post',
						// 提交的数据
						data:{'name':'jason','password':'123'},
						// 回调函数
						success:function (data) {  // data接收的就是异步提交返回的结果
							alert(data)
						}
					})
				})

ajax参数

data参数中的键值对，如果值不为字符串，需要将其转换成字符串类型。

$("#b1").on("click", function () {
    $.ajax({
      url:"/ajax_add/",
      type:"GET",
      data:{"i1":$("#i1").val(),"i2":$("#i2").val(),"hehe": JSON.stringify([1, 2, 3])},
      success:function (data) {
        $("#i3").val(data);
      }
    })
  })

ajax设置csrf token

$.ajax({
  url: "/cookie_ajax/",
  type: "POST",
  data: {
    "username": "Tonny",
    "password": 123456,
    "csrfmiddlewaretoken": $("[name = 'csrfmiddlewaretoken']").val()  // 使用JQuery取出csrfmiddlewaretoken的值，拼接到data中
  },
  success: function (data) {
    console.log(data);
  }
})

3.ajax传输json格式数据

$('#d1').click(function () {
		$.ajax({
			url:'',  // url参数可以不写，默认就是当前页面打开的地址
			type:'post',
			contentType:'application/json',
			data:JSON.stringify({'name':'jason','hobby':'study'}),
		success:function (data) {
					.....
				   }
			   })
			});

4.ajax传输文件

$('#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)
					}
				})
			});

form表单与ajax异同点

form表单不支持异步提交局部刷新

form表单不支持传输json格式数据

form表单与ajax默认传输数据的编码格式都是urlencoded

自定义分页器

数据库批量插入数据

l = []
for i in range(10000):
    l.append(models.Book2(name='第%s本书'%i))
models.Book2.objects.bulk_create(l)  

# 批量插入数据补充:<li><a href="?page=1">1</a></li>  # 自动补全当前路径

分页器类：

class Pagination(object):
    def __init__(self, current_page, all_count, per_page_num=2, pager_count=11):
        """
        封装分页相关数据
        :param current_page: 当前页
        :param all_count:    数据库中的数据总条数
        :param per_page_num: 每页显示的数据条数
        :param pager_count:  最多显示的页码个数

        用法:
        queryset = model.objects.all()
        page_obj = Pagination(current_page,all_count)
        page_data = queryset[page_obj.start:page_obj.end]
        获取数据用page_data而不再使用原始的queryset
        获取前端分页样式用page_obj.page_html
        """
        try:
            current_page = int(current_page)
        except Exception as e:
            current_page = 1

        if current_page < 1:
            current_page = 1

        self.current_page = current_page

        self.all_count = all_count
        self.per_page_num = per_page_num

        # 总页码
        all_pager, tmp = divmod(all_count, per_page_num)
        if tmp:
            all_pager += 1
        self.all_pager = all_pager

        self.pager_count = pager_count
        self.pager_count_half = int((pager_count - 1) / 2)

    @property
    def start(self):
        return (self.current_page - 1) * self.per_page_num

    @property
    def end(self):
        return self.current_page * self.per_page_num

    def page_html(self):
        # 如果总页码 < 11个：
        if self.all_pager <= self.pager_count:
            pager_start = 1
            pager_end = self.all_pager + 1
        # 总页码  > 11
        else:
            # 当前页如果<=页面上最多显示11/2个页码
            if self.current_page <= self.pager_count_half:
                pager_start = 1
                pager_end = self.pager_count + 1

            # 当前页大于5
            else:
                # 页码翻到最后
                if (self.current_page + self.pager_count_half) > self.all_pager:
                    pager_end = self.all_pager + 1
                    pager_start = self.all_pager - self.pager_count + 1
                else:
                    pager_start = self.current_page - self.pager_count_half
                    pager_end = self.current_page + self.pager_count_half + 1

        page_html_list = []
        # 添加前面的nav和ul标签
        page_html_list.append('''
                    <nav aria-label='Page navigation>'
                    <ul class='pagination'>
                ''')
        first_page = '<li><a href="?page=%s">首页</a></li>' % (1)
        page_html_list.append(first_page)

        if self.current_page <= 1:
            prev_page = '<li class="disabled"><a href="#">上一页</a></li>'
        else:
            prev_page = '<li><a href="?page=%s">上一页</a></li>' % (self.current_page - 1,)

        page_html_list.append(prev_page)

        for i in range(pager_start, pager_end):
            if i == self.current_page:
                temp = '<li class="active"><a href="?page=%s">%s</a></li>' % (i, i,)
            else:
                temp = '<li><a href="?page=%s">%s</a></li>' % (i, i,)
            page_html_list.append(temp)

        if self.current_page >= self.all_pager:
            next_page = '<li class="disabled"><a href="#">下一页</a></li>'
        else:
            next_page = '<li><a href="?page=%s">下一页</a></li>' % (self.current_page + 1,)
        page_html_list.append(next_page)

        last_page = '<li><a href="?page=%s">尾页</a></li>' % (self.all_pager,)
        page_html_list.append(last_page)
        # 尾部添加标签
        page_html_list.append('''
                                           </nav>
                                           </ul>
                                       ''')
        return ''.join(page_html_list)

自定义分页器的使用

在视图函数中实现下列代码，即可在视图函数中得到字符串形式的分页器前端代码

做后将 page_obj返回到templates文件 在前端渲染即可

    后端:
        book_list = models.Book2.objects.all()
        # 数据总条数
        all_count = book_list.count()
        # 当前页
        current_page = request.GET.get('page',1)
        # 实例一个分页器对象
        page_obj = my_page.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样式的分页器

​
​
​
​
​
​
​
​
​
​
​
​
​