Django pagination is an example from the documentation. How to display with all site numbers?

This is an example from the Django documentation:

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 (eg 9999), deliver last page of results. contacts = paginator.page(paginator.num_pages) return render_to_response('list.html', {"contacts": contacts}) 

template:

 {% 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> 

This screen, for example:

Page 2 of 3. next

How to display it as follows:

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

Current page tagged html <b> .

?

+6
source share
4 answers

You can try the following:

 {% 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 %} 
+19
source

Below is an example based on the class, but will work fine. CSS is 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 %} 
+18
source

If someone needs Bootstap 4 Alpha 5 code version.

I also made two changes:

  • I do not like duplicate pages, so in my case I changed /profiles/?page=1 to plain /profiles/ .
  • I have many pages, so I do not show all pages. I only show: 1st, last, current and + -3 pages from the current and every 10th page.

If you need only all pages with Bootstrap 4 without my modifications, just delete the unnecessary parts of the code (everything is commented out).

 {% 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 %} 

And it looks like this: enter image description here

+3
source

if i need to use if not equal in place

-1
source

Source: https://habr.com/ru/post/948791/


All Articles