z6c - personal blog about topics

Christian Müller – Letzte Änderung: 13.02.2013 11:20 Uhr

django-paginator-bootstrap.html

jmccell auf github hat ein nettes Vorgehen beschrieben, die Django interne Paginator Funktionalität mit Bootstrap zu kombinieren.

{#
This template snippet will take a page from a django Paginator and create a Twitter Bootstrap pagination HTML snippet.

To use:

{% include "path/to/django-paginator-bootstrap.html with page=contextVar only %}

Optional variables:

alignment - Accepts "centered" or "right". Other values have no affect. Default is left aligned.
hide_previous - Accepts "true" to hide
previous_label - Changes the Previous label text
hide_next - Accepts "true" to hide
next_label - Changes the Next label text
page_param - Changes the name of the page parameter (defaults to "page")

}#
<div class="pagination {% if alignment == "centered" %}pagination-centered{% endif %}{% if alignment == "right" %}pagination-right{% endif %}">    
    <ul>    
    {% if hide_previous != "true" %}
        {% if page.has_previous %}  
            <li class="prev">
                <a href="{{url_suffix|default:"?page="}}{{page.previous_page_number}}">{{previous_label|default:"&larr; Previous"}}</a>
            </li>
        {% else %}
            <li class="prev disabled">
                <a href="#">{{previous_label|default:"&larr; Previous"}}</a>
            </li>
        {% endif %}
    {% endif %}
    {% for pagenum in page.paginator.page_range %}    
        <li{% if page.number == pagenum %} class="active"{% endif %}>
            <a href="{{url_suffix|default:"?page="}}{{pagenum}}">{{pagenum}}</a>
        </li>
    {% endfor %}
    {% if hide_next != "true" %}
        {% if page.has_next %}
            <li class="next">
                <a href="{{url_suffix|default:"?page="}}{{page.next_page_number}}">{{next_label|default:"Next &rarr;"}}</a>
            </li>
        {% else %}
            <li class="next disabled">
                <a href="#">{{next_label|default:"Next &rarr;"}}</a>
            </li>
        {% endif %} 
    {% endif %}   
    </ul> 
</div>

Generell ok so, meine Pagination sieht aber nach Übernahme des Variablennamens so aus:

{% if is_paginated %}
    <div class="pagination pagination-centered">
        <ul>
            {% if page_obj.has_previous %}
                <li class="prev">
                    <a href="?page={{ page_obj.previous_page_number }}">{{ previous_label|default:"&larr; Zurück" }}</i></a>
                </li>
            {% else %}
                <li class="prev disabled">
                    <a href="#">{{ previous_label|default:"&larr; Zurück" }}</a>
                </li>
            {% endif %}
            {% for pagenum in page_obj.paginator.page_range %}
                <li{% if page_obj.number == pagenum %} class="active"{% endif %}>
                    <a href="{{ url_suffix|default:"?page=" }}{{ pagenum }}">{{ pagenum }}</a>
                </li>
            {% endfor %}
            {% if page_obj.has_next %}
                <li class="next">
                    <a href="?page={{ page_obj.next_page_number }}">{{ next_label|default:"Weiter &rarr;" }}</a>
                </li>
            {% else %}
                <li class="next disabled">
                    <a href="#">{{ next_label|default:"Weiter &rarr;" }}</a>
                </li>
            {% endif %}
        </ul>
    </div>
{% endif %}

So auch derzeit auf dieser Seite...

dev django bootstrap pagination

Kommentare für diesen Artikel noch nicht freigeschaltet.

Bitte eine Email an kommentare@zentonic.org mit Betreff "Kommentare für Post 17"