昨日回顾:
   1 ajax 什么是ajax:异步的JavaScript 和xml
   2 特点:异步,局部刷新
   3 简单的与后台交互:(携带数据:可以拼到url上---->从GET中取,)
    $.ajax({
       url:请求的地址,
       type:请求方式,(post,get....)
       //contentType:'application/json',(默认:urlencoded)
       data:{},往后台发送的数据
       success:function (data){
        //data的数据类型,不一定
        //异步的,成功返回,才能回调
       }
   })
  -携带数据:
      -可以拼到url上---->从GET中取 
      -默认urlencoded编码和formdata,放到data中的数据,------>POST
 
今日内容:
   分页器:
      -干啥的?数据量大的话,可以分页获取,查看
    基本写法:
       后端:
          -总数据拿出来
          -生成分页器Paginator对象(对象里有属性和方法)
          -生成当前页的对象,current_page=paginator.page(当前页码)
          -取出前台传过来的页码,current_page_num = int(request.GET.get('page'))
           -需要有异常捕获
           -捕获到,把当前页码设置成第一页
def manypage(request):
try:
page = int(request.GET.get('p'))
books = models.Book.objects.all()
paginator = Paginator(books, 10)
current_page = paginator.page(page)
if paginator.num_pages > 11:
if page - 5 < 1:
page_range = range(1, 12)
elif page + 5 > paginator.num_pages:
page_range = range(paginator.num_pages - 10, paginator.num_pages + 1)
else:
page_range = range(page - 5, page + 6)
else:
page_range = paginator.page_range
except Exception as e:
page = 1
current_page = paginator.page(page)
page_range = range(1, 12)
return render(request, 'manypage.html', locals())

前端:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>index</title>
<script src="/static/jquery-3.3.1.js"></script>
<link rel="stylesheet" href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css">
</head>
<body> <div class="col-md-offset-3 col-md-6">
<table class="table table-striped">
<thead>
<tr>
<th>书名</th>
<th>价格</th>
</tr>
</thead>
<tbody>
{% for book in current_page %}
<tr>
<td>{{ book.name }}</td>
<td>{{ book.price }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<nav aria-label="Page navigation">
<ul class="pagination">
{% if current_page.has_previous %}
<li>
<a href="?p={{ current_page.previous_page_number }}" aria-label="Previous">
<span aria-hidden="true">上一页</span>
</a>
</li>
{% else %}
<li class="disabled">
<a href="#" aria-label="Previous">
<span aria-hidden="true">上一页</span>
</a>
</li>
{% endif %}
{% for num in page_range %}
{% if num == page %}
<li class="active"><a href="?p={{ num }}">{{ num }}</a></li>
{% else %}
<li><a href="?p={{ num }}">{{ num }}</a></li>
{% endif %}
{% endfor %}
{% if current_page.has_next %}
<li>
<a href="?p={{ current_page.next_page_number }}" aria-label="Next">
<span aria-hidden="true">下一页</span>
</a>
</li>
{% else %}
<li class="disabled">
<a href="#" aria-label="Next">
<span aria-hidden="true">下一页</span>
</a>
</li>
{% endif %}
</ul>
</nav>
</div>
</body>
</html>

批量插入输入:
    -models.Book.objects.bulk_create(ll)

   
  

day76的更多相关文章

  1. day76 auth模块 用户验证,

    概要: form组件回顾: (1) 创建form组件对应的类,比如LoginForm (2) views.login: if get请求: form_obj=LoginForm() return re ...

  2. python 全栈开发,Day76(Django组件-cookie,session)

    昨日内容回顾 1 json 轻量级的数据交换格式 在python 序列化方法:json.dumps() 反序列化方法:json.loads() 在JS中: 序列化方法:JSON.stringfy() ...

  3. day76 作业

    目录 需求: 作业1: 作业2: 需求: 1. 在作业1.html代码的基础上,引入vue.js文件,并实例化vm对象,绑定#goods元素 2. 在作业1.html代码的基础上,默认中间弹出窗口隐藏 ...

  4. day76 vue框架入门

    目录 一.vue.js快速入门使用 1 vue.js库的下载 2 vue.js库的使用 3 vue.js的M-V-VM思想 4 显示数据 二.常用指令 1 操作属性 2 事件的绑定 3 样式操作 3. ...

  5. day76:luffy:项目前端环境搭建&轮播图的实现

    目录 1.项目前端环境搭建 1.创建项目目录 2.前端初始化全局变量和全局方法 3.跨域CORS 4.axios配置 2.轮播图功能的实现 1.安装依赖模块 2.上传文件相关配置 3.注册home子应 ...

  6. 100 天从 Python 新手到大师

    Python应用领域和就业形势分析 简单的说,Python是一个“优雅”.“明确”.“简单”的编程语言. 学习曲线低,非专业人士也能上手 开源系统,拥有强大的生态圈 解释型语言,完美的平台可移植性 支 ...

  7. Django基础模型层(77-78)

    jango框架之模型层(d77-78)一 单表操作: 1 mysql数据库:settings里配置  'default': {   # key值必须都是大写   'ENGINE': 'django.d ...

  8. 模拟django配置环境进行数据增删改查,测试的时候有用

    import os if __name__ == '__main__': os.environ.setdefault('DJANGO_SETTINGS_MODULE','day76.settings' ...

  9. ORM表操作

    1.在python脚本中调用django环境 在根文件夹下,创建test.py文件 import os if __name__ == '__main__': os.environ.setdefault ...

随机推荐

  1. mysql小试题3

    查询结果:

  2. js实现分享到QQ

    js代码 <script src="http://connect.qq.com/widget/loader/loader.js" widget="shareqq&q ...

  3. js-数字、字符串、布尔值的转换方式

    来自JavaScript秘密花园 1.转换为字符串 '' + 10 === '10'; // true 将一个值加上空字符串可以轻松转换为字符串类型. 2.字符串转换为数字 +'010' === 10 ...

  4. 纯小白入手 vue3.0 CLI - 2.1 - 组件 ( component )

    vue3.0 CLI 真小白入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html 我的 github 地址 - vue3.0Study  ...

  5. linux下安装jenkins实现自动化部署

    安装 开始 1.安装之前,必须先安装JDK 可以参考  http://www.cnblogs.com/ericli-ericli/p/7070874.html 2.使用相关命令: wget -q -O ...

  6. Ajax如何设置cookie

    普通的Ajax请求很遗憾不能返回服务器端设置的cookie 如何实现不刷新页面返回服务器设置的Cookie呢? 可以使用<script>或者<image>的src属性发起一个请 ...

  7. Android热修复之 - 收集崩溃信息上传服务器

    1.概述 大致的流程就是在用户崩溃的时候,我们获取崩溃信息.应用当前的信息和手机信息,然后把它保存到手机内存卡,再找我就直接找出来看看.后来衍生到上线后某些奇葩机型会有部分问题,所以不得不上传到服务器 ...

  8. Mongodb的入门(4)mongodb3.6的索引

    Mongodb的索引: 在介绍索引之前,再强调一下nosql数据库和sql数据库的区别: sql数据库:结构化数据,定好了表格后,每一行的内容都是结构化的 mongo:文档数据,表下的数据都可以有自己 ...

  9. LeetCode题解之Copy List with Random Pointer

    1.题目描述 2.问题分析 首先要完成一个普通的单链表的深度复制,然后将一个旧的单链表和新的单链表的节点使用map对应起来,最后,做一次遍历即可. 3.代码 RandomListNode *copyR ...

  10. Web Services 根据wsdl生成代理类

    生成代理类步骤: 一:找到Visual Studio 的工具文件夹 二:用管理员方式打开本机工具命令提示 三:输入要执行的脚本 wsdl /language:C# /n:xxxx.HermesMobi ...