【问题标题】:How to move paginator block to the footer?如何将分页器块移动到页脚?
【发布时间】:2018-05-16 06:24:42
【问题描述】:

我开发了一个 django 应用程序。我在网页中添加了一个分页器块。它被放置在错误的位置。相反,我希望将它放在正在显示的列表下方。实际上,我在页面上显示组列表。每页仅显示 5 个组名。使用分页,我做到了。但问题是我无法将其放置在正确的位置。我正在附加页面的图像。

这个的html页面是:

    {% extends "groups/group_base.html" %}
{% block pregroup %}
<div class="col-md-4">
    <div class="content">
        {% if user.is_authenticated %}
        <h2>
            Welcome back
            <a href="{% url 'posts:for_user' username=user.username %}">@{{user.username }}</a>
        </h2>

    {% endif %}
            <h2>Groups</h2>

            <p>Welcome to the Groups Page! Select a Group with a shared interest!</p>
    </div>
    {% if user.is_authenticated %}
    <a href="{% url 'groups:create' %}" class="btn btn-md btn-fill btn-warning"><span class="glyphicon glyphicon-plus-sign"></span> Create New Group!</a>
    {% endif %}
</div>
{% endblock %}

{% block group_content %}

<div class="col-md-8">
    <div class="list-group">
        {% for group in object_list %}
          <a class="list-group-item" href="{% url 'groups:single' slug=group.slug %}">
                 <h3 class="title list-group-item-heading">{{ group.name }}</h3>
            <div class="list-group-item-text container-fluid">
                {{ group.description_html|safe }}
                <div class="row">
                    <div class="col-md-4">
                        <span class="badge">{{ group.members.count }}</span> member{{ group.members.count|pluralize }}
                    </div>
                    <div class="col-md-4">
                        <span class="badge">{{ group.posts.count }}</span> post{{ group.posts.count|pluralize }}
                    </div>
                </div>
            </div>
        </a>
        {% endfor %}
    </div>

</div>
{% block pagination %}
{% if is_paginated %}
  <ul class="pagination" style="display:inline-block">
    {% if page_obj.has_previous %}
      <li><a href="?page={{ page_obj.previous_page_number }}">&laquo;</a></li>
    {% else %}
      <li class="disabled"><span>&laquo;</span></li>
    {% endif %}
    {% for i in paginator.page_range %}
      {% if page_obj.number == i %}
        <li class="active"><span>{{ i }} <span class="sr-only">(current)</span></span></li>
      {% else %}
        <li><a href="?page={{ i }}">{{ i }}</a></li>
      {% endif %}
    {% endfor %}
    {% if page_obj.has_next %}
      <li><a href="?page={{ page_obj.next_page_number }}">&raquo;</a></li>
    {% else %}
      <li class="disabled"><span>&raquo;</span></li>
    {% endif %}
  </ul>
{% endif %}
{% endblock %}

{% endblock %}

【问题讨论】:

    标签: python html css django pagination


    【解决方案1】:

    分页代码应该在 col-md-8 div 标签内,如下所示 ::

     {% extends "groups/group_base.html" %}
    {% block pregroup %}
    <div class="col-md-4">
        <div class="content">
            {% if user.is_authenticated %}
            <h2>
                Welcome back
                <a href="{% url 'posts:for_user' username=user.username %}">@{{user.username }}</a>
            </h2>
    
        {% endif %}
                <h2>Groups</h2>
    
                <p>Welcome to the Groups Page! Select a Group with a shared interest!</p>
        </div>
        {% if user.is_authenticated %}
        <a href="{% url 'groups:create' %}" class="btn btn-md btn-fill btn-warning"><span class="glyphicon glyphicon-plus-sign"></span> Create New Group!</a>
        {% endif %}
    </div>
    {% endblock %}
    
    {% block group_content %}
    
    <div class="col-md-8">
        <div class="list-group">
            {% for group in object_list %}
              <a class="list-group-item" href="{% url 'groups:single' slug=group.slug %}">
                     <h3 class="title list-group-item-heading">{{ group.name }}</h3>
                <div class="list-group-item-text container-fluid">
                    {{ group.description_html|safe }}
                    <div class="row">
                        <div class="col-md-4">
                            <span class="badge">{{ group.members.count }}</span> member{{ group.members.count|pluralize }}
                        </div>
                        <div class="col-md-4">
                            <span class="badge">{{ group.posts.count }}</span> post{{ group.posts.count|pluralize }}
                        </div>
                    </div>
                </div>
            </a>
            {% endfor %}
        </div>
    
    {% block pagination %}
    {% if is_paginated %}
      <ul class="pagination" style="display:inline-block">
        {% if page_obj.has_previous %}
          <li><a href="?page={{ page_obj.previous_page_number }}">&laquo;</a></li>
        {% else %}
          <li class="disabled"><span>&laquo;</span></li>
        {% endif %}
        {% for i in paginator.page_range %}
          {% if page_obj.number == i %}
            <li class="active"><span>{{ i }} <span class="sr-only">(current)</span></span></li>
          {% else %}
            <li><a href="?page={{ i }}">{{ i }}</a></li>
          {% endif %}
        {% endfor %}
        {% if page_obj.has_next %}
          <li><a href="?page={{ page_obj.next_page_number }}">&raquo;</a></li>
        {% else %}
          <li class="disabled"><span>&raquo;</span></li>
        {% endif %}
      </ul>
    {% endif %}
    {% endblock %}
    
    </div>
    
    
    
    {% endblock %}
    

    【讨论】:

      猜你喜欢
      • 2017-09-05
      • 1970-01-01
      • 2021-06-07
      • 2015-12-08
      • 1970-01-01
      • 2016-05-27
      • 2013-11-05
      • 1970-01-01
      • 2011-06-21
      相关资源
      最近更新 更多