Django实现文章列表的分页功能

一重写视图函数article_list，实现分页功能

@login_required(login_url='/account/login')
def article_list(request):
    # 请求用户的文章列表
    articles_list = ArticlePost.objects.filter(author=request.user)
    # 依据查询到的文章对象articles_list创建分页实例对象，并且规定每页最多5篇文章
    paginator = Paginator(articles_list, 5)
    # 获得当前浏览器GET请求的参数page的值，也就是当前浏览器所请求的页面数值
    page = request.GET.get('page')
    try:
        # 用于得到指定页面的内容
        current_page = paginator.page(page)
        # 得到当前页的所有对象列表
        articles = current_page.object_list
    # 请求页码数值不是整数
    except PageNotAnInteger:
        current_page = paginator.page(1)
        articles = current_page.object_list
    # 请求页码数值为空或者在URL参数中没有page
    except EmptyPage:
        # paginator.num_pages返回的是页数
        current_page = paginator.page(paginator.num_pages)
        articles = current_page.object_list
    # 给前端渲染的数据是文章列表和当前页
    return render(request, "article/column/article_list.html", {"articles":articles, "page": current_page})

二编写一个分页功能的模板mysite/templates/paginator.html

<div class="pagination">
  <span class="step-links">
    <!--判断是否有上一页-->
    {% if page.has_previous %}
    <!--返回上一页的页码-->
    <a href="?page={{ page.previous_page_number }}">上一页</a>
    {% endif %}
    <span class="current">
      <!--page.number：当前页的页码-->
      <!--page.paginator.num_pages：关联Paginator对象，并得到总页数-->
      页 {{ page.number }} of {{ page.paginator.num_pages }}
    </span>
    <!--返回下一页的页码-->
    {% if page.has_next %}
    <a href="?page={{ page.next_page_number }}">下一页</a>
    {% endif %}
  </span>
</div>

三在mysite/templates/article/column/article_list.html中引入该模板

{% extends "article/base.html" %}
{% load staticfiles %}
{% block title %}文章列表{% endblock %}
{% block content %}
<div>
    <table class="table table-hover">
        <tr>
            <td>序号</td>
            <td>标题</td>
            <td>栏目</td>
            <td>操作</td>
        </tr>
        {% for article in articles %}
        <tr id={{ article.id }}>
            <td>{{ forloop.counter }}</td>
            <td><a href="{{ article.get_absolute_url }}">{{ article.title }}</a></td>
            <td>{{ article.column }}</td>
            <td>
                <!-- article.id对应URL中的article.id -->
                <a name="edit" href="{% url 'article:redit_article' article.id %}"><span class="glyphicon glyphicon-pencil"></span></a>
                <a name="delete" href="javascript:" onclick="del_article(this, {{ article.id }})"><span class="glyphicon glyphicon-trash" style="margin-left:20px;"></span></a>
            </td>
        </tr>
        {% endfor %}
    </table>
    <!--引入分页功能-->
    {% include "paginator.html" %}
</div>
<script type="text/javascript" src='{% static "js/jquery.js" %}'></script>
<script type="text/javascript" src="{% static 'js/layer.js'%}"></script>
<script type="text/javascript">
function del_article(the, article_id){
    var article_name = $(the).parents("tr").children("td").eq(1).text();
        layer.open({
        type: 1,
        skin: "layui-layer-rim",
        area: ["400px", "200px"],
        title: "删除文章",
        content: '<div class="text-center" style="margin-top:20px"><p>是否确定删除《'+article_name+'》</p></div>',
        btn:['确定', '取消'],
        yes: function(){
        $.ajax({
            url: '{% url "article:del_article" %}',
            type:"POST",
            data: {"article_id":article_id},
            success: function(e){
            if(e=="1"){
                parent.location.reload();
                layer.msg("删除成功");
            }else{
                layer.msg("删除失败");
            }

            },
        })
        },
    });
    }
</script>

{% endblock %}

四测试

Django实现文章列表的分页功能

猜你喜欢