2013-07-05 10 views
6

To jest przykład z dokumentacją Django:Paginacja Django - przykład z dokumentacji. Jak wyświetlić wszystkie numery witryn?

def listing(request): 
    contact_list = Contacts.objects.all() 
    paginator = Paginator(contact_list, 25) # Show 25 contacts per page 

    page = request.GET.get('page') 
    try: 
     contacts = paginator.page(page) 
    except PageNotAnInteger: 
     # If page is not an integer, deliver first page. 
     contacts = paginator.page(1) 
    except EmptyPage: 
     # If page is out of range (e.g. 9999), deliver last page of results. 
     contacts = paginator.page(paginator.num_pages) 

    return render_to_response('list.html', {"contacts": contacts}) 

szablon:

{% for contact in contacts %} 
    {# Each "contact" is a Contact model object. #} 
    {{ contact.full_name|upper }}<br /> 
    ... 
{% endfor %} 

<div class="pagination"> 
    <span class="step-links"> 
     {% if contacts.has_previous %} 
      <a href="?page={{ contacts.previous_page_number }}">previous</a> 
     {% endif %} 

     <span class="current"> 
      Page {{ contacts.number }} of {{ contacts.paginator.num_pages }}. 
     </span> 

     {% if contacts.has_next %} 
      <a href="?page={{ contacts.next_page_number }}">next</a> 
     {% endif %} 
    </span> 
</div> 

Ten wyświetlacz na przykład:

Strona 2 z 3. Następnie

Jak wyświetl go w ten sposób:

previous 1 <b>2</b> 3 Next 

Bieżąca strona z znacznikiem html <b>.

?

Odpowiedz

17

Można spróbować to:

{% for num in contacts.paginator.page_range %} 
    {% ifequal num contacts.number %} 
    <span class="current"><b>{{ num }}</b></span> 
    {% else %} 
    <a href="?page={{ num }}"> {{ num }}</a> 
    {% endifequal %} 
{% endfor %} 
+0

Uwaga: Można wymienić "ifequal" z {% jeśli num == contacts.number%} ... {% else%} {% ... endif%} – yesnik

16

Poniżej przykład jest rzeczywiście dla poglądów opartych klasy, ale będzie działać dobrze. CSS to Twitter Bootstrap V3.0.0.

{% if is_paginated %} 
    <ul class="pagination"> 
    {% if page_obj.has_previous %} 
     <li><a href="?page={{ page_obj.previous_page_number }}">&laquo;</a></li> 
    {% else %} 
     <li class="disabled"><a href="#">&laquo;</a></li> 
    {% endif %} 

    {% for num in page_obj.paginator.page_range %} 
     {% ifequal num page_obj.number %} 
     <li class="active"><a href="#">{{ num }}<span class="sr-only">(current)</span></a></li> 
     {% else %} 
     <li><a href="?page={{ num }}">{{ num }}</a></li> 
     {% endifequal %} 
    {% endfor %} 

    {% if page_obj.has_next %} 
     <li><a href="?page={{ page_obj.next_page_number }}">&raquo;</a></li> 
    {% else %} 
     <li class="disabled"><a href="#">&raquo;</a></li> 
    {% endif %} 
    <ul> 
{% endif %} 
+0

Ta odpowiedź jest idealna, ale na mojej stronie znajduje się łącznie 50 stron, a następnie wyświetlany jest numer 1 ... 50 stron. co zrobić, aby rozwiązać ten problem? – Mohini

1

Jeśli ktoś potrzebuje wersji kodu Bootstap 4 Alpha 5.

Również zrobiłem dwie zmiany:

  1. nie lubię duplikaty stron, więc zmieniło się w moim przypadku /profiles/?page=1 do prostego /profiles/.
  2. Mam wiele stron, więc nie pokazuję wszystkich stron. Pokazuję tylko: 1., ostatnią, aktualną i +3 strony z bieżącego i co 10. stronę.

Jeśli potrzebujesz tylko wszystkich stron z Bootstrap 4 bez moich modyfikacji, po prostu usuń niepotrzebne części kodu (wszystko jest skomentowane).

{% if is_paginated %} 
    <nav aria-label="Page navigation"> 
     <ul class="pagination"> 
      <!-- << PREVIOUS PART --> 
      <!-- << Disable 'Previous' page button if you are at the 1st page --> 
      {% if not page_obj.has_previous %} 
       <li class="page-item disabled"> 
        <a class="page-link" href="#" tabindex="-1" aria-label="Previous"> 

      <!-- << If you are at the 2nd page, 
      'Previous' page button will get '/profiles/' url instead of '/profiles/?page=1' --> 
      {% elif page_obj.previous_page_number == 1 %} 
       <li class="page-item"> 
        <a class="page-link" href="{{ profiles_1st_page_url }}" aria-label="Previous"> 

      {% else %} 
       <li class="page-item"> 
        <a class="page-link" href="?page={{ page_obj.previous_page_number }}" aria-label="Previous"> 
      {% endif %} 

         <span aria-hidden="true">&laquo;</span> 
         <span class="sr-only">Previous</span> 
        </a> 
       </li> 

      <!-- PAGES PART --> 
      {% for num in page_obj.paginator.page_range %} 
       <!-- Active page --> 
       {% if num == page_obj.number %} 
        <li class="page-item active"> 
         <a class="page-link" href="#">{{ num }}<span class="sr-only">(current)</span></a> 
        </li> 

       {% else %} 
        <li class="page-item"> 
         <!-- For the 1st page we do not use ?page=1 --> 
         {% if num == 1 %} 
          <a class="page-link" href="{{ profiles_1st_page_url }}">{{ num }}</a> 

         {% else %} 
          <!-- Show current page and +-3 pages --> 
          {% if num|add:"-3" <= page_obj.number and page_obj.number <= num|add:"3" %} 
           <a class="page-link" href="?page={{ num }}">{{ num }}</a> 

          <!-- Shows every 10th page and the last page --> 
          {% elif num|divisibleby:"10" or num == page_obj.paginator.num_pages %} 
           <a class="page-link" href="?page={{ num }}">{{ num }}</a> 
          {% endif %} 

         {% endif %} 
        </li> 
       {% endif %} 

      {% endfor %} 

      <!-- >> NEXT PART --> 
      {% if not page_obj.has_next %} 
       <!-- << Disable 'Next' page button if you are at the last page --> 
       <li class="page-item disabled"> 
        <a class="page-link" href="#" tabindex="-1" aria-label="Next"> 

      {% else %} 
       <li class="page-item"> 
        <a class="page-link" href="?page={{ page_obj.next_page_number }}" aria-label="Next"> 
      {% endif %} 

         <span aria-hidden="true">&raquo;</span> 
         <span class="sr-only">Next</span> 
        </a> 
       </li> 

     </ul> 
    </nav> 
{% endif %} 

I wygląda na to: enter image description here

Powiązane problemy