Login

Bootstrap theme for django-endless-pagination?

Author:
se210
Posted:
January 4, 2016
Language:
HTML/template
Version:
1.7
Score:
0 (after 0 ratings)

An example for using bootstrap theme for django-endless-pagination or django-el-pagination as asked on http://stackoverflow.com/questions/30149152/how-to-set-bootstrap-theme-for-django-endless-pagination

I used django-el-pagination to make it work on Django 1.9 and Bootstrap v4.0.0-alpha2, but same method should work on django-endless-pagination. For Bootstrap 3, you may consider removing extraneous classes in <li> and <a>.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
{% get_pages %}
<ul class="pagination">
{% if pages.paginated %}
  <li class="page-item">
    <a class="page-link" href="{{ pages.first.path }}" aria-label="First">
      <span aria-hidden="true">&lt;&lt;</span>
      <span class="sr-only">First</span>
    </a>
  </li>
  <li class="page-item">
    <a class="page-link" href="{{ pages.previous.path }}" aria-label="Previous">
      <span aria-hidden="true">&lt;</span>
      <span class="sr-only">Previous</span>
    </a>
  </li>
  {% for page in pages %}
    {% if page == None %}
      <li class="page-item disabled">
        <a class="page-link" href="#" aria-label="...">
          <span aria-hidden="true">...</span>
          <span class="sr-only">...</span>
        </a>
      </li>
    {% else %}
      <li class="page-item {% if page.is_current %} active {% endif %}">
        <a class="page-link" href="{{ page.path }}" aria-label="Page {{page.number}}">
          <span aria-hidden="true">{{ page.label|safe }}</span>
          <span class="sr-only">Page {{page.number}}</span>
        </a>
      </li>
    {% endif %}
  {% endfor %}
  <li class="page-item">
    <a class="page-link" href="{{ pages.next.path }}" aria-label="Next">
      <span aria-hidden="true">&gt;</span>
      <span class="sr-only">Next</span>
    </a>
  </li>
  <li class="page-item">
    <a class="page-link" href="{{ pages.last.path }}" aria-label="Last">
      <span aria-hidden="true">&gt;&gt;</span>
      <span class="sr-only">Last</span>
    </a>
  </li>
{% endif %}
</ul>

More like this

  1. Bootstrap Accordian by Netplay4 7 years, 9 months ago
  2. Bootstrap theme for django-endless-pagination? by se210 10 years, 9 months ago
  3. Reusable form template with generic view by roldandvg 10 years, 10 months ago
  4. Pagination Django with Boostrap by guilegarcia 11 years ago
  5. django form template with bootstrap by youyongsong 11 years, 8 months ago

Comments

Please login first before commenting.