zoukankan      html  css  js  c++  java
  • CRM之分页

    分页简介

      分页功能在网页中是非常常见的一个功能,其作用也就是将数据分割成多个页面来进行显示。

      使用场景: 当取到的数据量达到一定的时候,就需要使用分页来进行数据分割。

      当我们不使用分页功能的时候,会面临许多的问题:

        客户端的问题: 如果数据量太多,都显示在同一个页面的话,会因为页面太长严重影响到用户的体验,也不便于操作,也会出现加载太慢的问题。

        服务端的问题: 如果数据量太多,可能会造成内存溢出,而且一次请求携带的数据太多,对服务器的性能也是一个考验。

    例子:

    用类的方式:

    在后台进行分页

    1.首先在项目根目录下创建一个utils包, 创建pagination.py文件

    
    
    # pagination.py
    class Pagination:
    
        def __init__(self, page_num, all_count, per_num=11, max_page=10):
            """
            :param page_num: 当前页数
            :param all_count: 总数据量
            :param per_num: 每页显示的数据量
            :param max_page: 显示最大页码数, 默认为10页
            """
    
            # 获取页码
            try:
                self.page_num = int(page_num)
                if self.page_num <= 0:
                    self.page_num = 1
            except Exception as e:
                self.page_num = 1
            # 每页显示的数据
            self.per_num = per_num
    
            # 总数据量
            self.all_count = all_count
    
            # 总页数
            # divmod(a, b) 返回一个包含商和余数的元组(a // b, a % b)。
            self.page_count, more = divmod(all_count, per_num)
            if more:
                self.page_count += 1
    
            # 显示最大页码数
            self.max_page = max_page
            self.half_page = max_page // 2
      @property
        def page_html(self):
            if self.page_count < self.max_page:
                page_start = 1
                page_end = self.page_count
            else:
                if self.page_num <= self.half_page:
                    page_start = 1
                    page_end = self.max_page
                elif self.page_num + self.half_page >= self.page_count:
                    page_start = self.page_count - self.max_page + 1
                    page_end = self.page_count
                else:
                    page_start = self.page_num - self.half_page  # 2
                    page_end = self.page_num + self.half_page  # 7 +
    
            page_list = []
            # 控制页数不能低于1
            if self.page_num == 1:
                page_list.append('<li class="disabled"><a href="?page={}">上一页</a></li>'.format(self.page_num))
            else:
                page_list.append('<li><a href="?page={}">上一页</a></li>'.format(self.page_num - 1))
    
            for page in range(page_start, page_end + 1):
                if page == self.page_num:
                    page_list.append('<li class="active"><a href="?page={}">{}</a></li>'.format(page, page))
                else:
                    page_list.append('<li><a href="?page={}">{}</a></li>'.format(page, page))
            # 控制不能超过总页数
            if self.page_num == self.page_count:
                page_list.append('<li class="disabled"><a href="?page={}">下一页</a></li>'.format(self.page_count))
            else:
                page_list.append('<li><a href="?page={}">下一页</a></li>'.format(self.page_num + 1))
            return ''.join(page_list)
       @property
        def start(self):
            return (self.page_num - 1) * self.per_num
       @property
        def end(self):
            return self.page_num * self.per_num
    # views.py   
    
    from django.shortcuts import render, reverse, redirect, HttpResponse
    
    from utils.pagination import Pagination
    
    
    # 模拟数据
    users = [{'name': 'Jerry{}'.format(i), 'pwd': '123'} for i in range(1, 302)]
    
    def user_list(request):
        """
        一页显示20
    
        第1页  0      20
        第2页  20     40
    
          n   (n-1)*20   20*n
    
        :param request:
        :return:
        """
        page = Pagination(request.GET.get('page', '1'), len(users))
        return render(request, 'user_list.html',{'users':users[page.start:page.end],'page_html':page.page_html })
    # user_list.html  网页文件
    {% extends 'layout.html' %} # 继承了一个模板 {% block content %} <table class="table table-hover table-bordered"> {% for foo in users %} <tr> <td>{{ foo.name }}</td> <td>{{ foo.pwd }}</td> </tr> {% endfor %} </table> <nav aria-label="Page navigation"> <ul class="pagination"> {{ page_html|safe }} </ul> </nav> {% endblock %}

    效果图:

    函数的方式:

    # views.py
    # 模拟数据
    users = [{'name': 'Jerry{}'.format(i), 'pwd': '123'} for i in range(1, 302)]
    
    
    
    def user_list(request):
    """
    一页显示20

    第1页 0 20
    第2页 20 40

    n (n-1)*20 20*n

    :param request:
    :return:
    """
    # 获取页码
    try:
    page_num = int(request.GET.get('page', '1'))
    if page_num <= 0:
    page_num = 1
    except Exception as e:
    page_num = 1
    # 每页显示的数据
    per_num = 10

    # 总数据量
    all_count = len(users)

    # 总页数
    # divmod(a, b) 返回一个包含商和余数的元组(a // b, a % b)。
    page_count, more = divmod(all_count, per_num)
    if more:
    page_count += 1

    # 显示最大页码数
    max_page = 11
    half_page = max_page // 2

    # python中循环
    if page_count < max_page:
    page_start = 1
    page_end = page_count
    else:
    if page_num <= half_page:
    page_start = 1
    page_end = max_page
    elif page_num + half_page >= page_count:
    page_start = page_count - max_page + 1
    page_end = page_count
    else:
    page_start = page_num - half_page # 2
    page_end = page_num + half_page # 7 +

    page_list = []
    # 控制页数不能低于1
    if page_num == 1:
    page_list.append('<li class="disabled"><a href="?page={}">上一页</a></li>'.format(page_num))
    else:
    page_list.append('<li><a href="?page={}">上一页</a></li>'.format(page_num - 1))

    for page in range(page_start, page_end + 1):
    page_list.append('<li><a href="?page={}">{}</a></li>'.format(page, page))

    # 控制不能超过总页数
    if page_num == page_count:
    page_list.append('<li class="disabled"><a href="?page={}">下一页</a></li>'.format(page_count))
    else:
    page_list.append('<li><a href="?page={}">下一页</a>>下一页</li>'.format(page_num + 1))
    page_html = ''.join(page_list)
    return render(request, 'user_list.html', {"users": users[(page_num - 1) * per_num:page_num * per_num],
    'page_html': mark_safe(page_html)})
    # user_list.html  
    
    {% extends 'layout.html' %}
    
    {% block content %}
        <table class="table table-hover table-bordered">
            {% for foo in users %}
                <tr>
                    <td>{{ foo.name }}</td>
                    <td>{{ foo.pwd }}</td>
                </tr>
            {% endfor %}
        </table>
        <nav aria-label="Page navigation">
            <ul class="pagination">
    
                {{ page_html }}
            </ul>
        </nav>
    
    {% endblock %}
  • 相关阅读:
    61个下拉菜单实例
    简单图片放大效果
    QQ,MSN,Skype在线客服代码
    codesmith自定义模板之实体层
    如何利用缓存提高ASP.NET网站速度
    10+Jquery Tooltip Plugins and Tutorial Collection
    10个ajax 上传插件
    ASP.NET 中 “返回上一页”,“上一步”的实现方法
    执行多条SQL语句,事务处理
    [Asp.Net+C#]Datagrid使用技巧四(怎样控制在一个单元格中放置多个操作按钮及删除数据)
  • 原文地址:https://www.cnblogs.com/q455674496/p/10526322.html
Copyright © 2011-2022 走看看