zoukankan      html  css  js  c++  java
  • Django2.0 分页的应用

    #分页例子
    from django.core.paginator import Paginator
    def blog_list(request):
          blog_all_list = models.Blog.objects.all()
          paginator = Paginator(blog_all_list,1) #10个一页 进行分页
          page_num = request.GET.get('page', 1) #获取url页面参数 没有默认显示第一页
          page_of_blogs = paginator.get_page(page_num)

          context = {}
          context['page_of_blogs'] = page_of_blogs #得到每页的数据
          context['blog_types'] = models.BlogType.objects.all()
          # context['blogs_count'] =models.Blog.objects.all().count()
          return render_to_response('blog_list.html', context)

    #分页html代码
    -- 分页页码样式和标签采用bootstrap的例子做的
    -- 连接是https://v3.bootcss.com/components/#pagination
    <nav aria-label="Page navigation">
        <ul class="pagination">
          <li>
            <!-- 上一页 -->
            {% if page_of_blogs.has_previous %} <!-- 是否有上一页 -->
               <a href="?page={{ page_of_blogs.previous_page_number }}" aria-label="Previous">
                 <span aria-hidden="true">&laquo;</span>
              </a>
           {% else %}
              <!-- <span aria-hidden="true">&laquo;</span> -->
           {% endif %}
         </li>
            {% for page_num in page_of_blogs.paginator.page_range %}
               <li><a href="?page={{ page_num }}">{{ page_num }}</a></li>
            {% endfor %}
         <li>
           <!-- 下一页 -->
          {% if page_of_blogs.has_next %} <!-- 是否有下一页 -->
             <a href="?page={{ page_of_blogs.next_page_number }}" aria-label="Next">
             <span aria-hidden="true">&raquo;</span>
            </a>
          {% else %}
             <!-- <span aria-hidden="true">&raquo;</span> -->
          {% endif %}
         </li>
       </ul>
    </nav>

    #总结
    向前段传递分页对象page_of_blogs
    对象属性:

                     - page_of_blogs.num_pages                    总页数 (最后一页)
                     - page_of_blogs.has_previous                    是否有上一页
                     - page_of_blogs.previous_page_number   上一页页数
                     - page_of_blogs.has_next                           是否有下一页
                     - page_of_blogs.next_page_number          下一页页数

    判断上一页下一页代码:
    -- 是否有下一页如果有就输出上一页图标
    {% if page_of_blogs.has_next %}
        <a href="?page={{ page_of_blogs.next_page_number }}" aria-label="Next">
              <span aria-hidden="true">&raquo;</span>
       </a>
    {% else %}
    -- 如果没有可以输出一个空或者输出一个没有a便签的图标
           <!-- <span aria-hidden="true">&raquo;</span> -->
    {% endif %}

    #完整代码  包括上一页 下一页 首页 尾页
    <
    nav aria-label="Page navigation"> <ul class="pagination"> <li> <!-- 上一页 --> {% if page_of_blogs.has_previous %} <!-- 是否有上一页 --> <a href="?page=1" aria-label="Previous"> <span aria-hidden="true">首页</span> </a> <a href="?page={{ page_of_blogs.previous_page_number }}" aria-label="Previous"> <!-- <span aria-hidden="true">&laquo;</span> --> <span aria-hidden="true">上一页</span> </a> {% else %} <!-- <a href="?page=1" aria-label="Previous"> <span aria-hidden="true">首页</span> </a> --> {% endif %} </li> {% for page_num in page_of_blogs.paginator.page_range %} <li><a href="?page={{ page_num }}">{{ page_num }}</a></li> {% endfor %} <li> <!-- 下一页 --> {% if page_of_blogs.has_next %} <!-- 是否有下一页 --> <a href="?page={{ page_of_blogs.next_page_number }}" aria-label="Next"> <!-- <span aria-hidden="true">&raquo;</span> --> <span aria-hidden="true">下一页</span> </a> <a href="?page={{ page_of_blogs.paginator.num_pages }}" aria-label="Next"> <span aria-hidden="true">尾页</span> </a> {% else %} <!-- <span aria-hidden="true">&raquo;</span> --> <!-- <a href="?page={{ page_of_blogs.end_index }}" aria-label="Next"> <span aria-hidden="true">尾页</span> </a> --> {% endif %} </li> </ul> </nav>

    效果:

  • 相关阅读:
    EntityFramework Code-First 简易教程(五)-------领域类配置
    EntityFramework Code-First 简易教程(四)-------继承策略
    Springboot整合mybatis:Invalid bound statement (not found)
    centos7服务器安装mysql8
    redis-Jedis
    redis学习-集群模式cluster
    redis学习-发布订阅
    redis学习-持久化机制
    redis学习-简单事务
    redis学习-哨兵模式
  • 原文地址:https://www.cnblogs.com/kuku0223/p/11571410.html
Copyright © 2011-2022 走看看