Skip to content

Instantly share code, notes, and snippets.

@hitrust
Created May 18, 2024 07:11
Show Gist options
  • Save hitrust/db2b0d813fcbf654d0c55744a73e8c98 to your computer and use it in GitHub Desktop.
Save hitrust/db2b0d813fcbf654d0c55744a73e8c98 to your computer and use it in GitHub Desktop.
pagination.jinja
{% macro render_pagination(
pagination,
endpoint=None,
prev=('«')|safe,
next=('»')|safe,
size=None,
ellipses='…',
args={},
fragment='',
align=''
) %}
<nav aria-label="Page navigation">
<ul class="pagination{% if size %} pagination-{{ size }}{% endif %} {% if align == 'center' %}justify-content-center{% elif align == 'right' %}justify-content-end{% endif %}"{{ kwargs|xmlattr }}>
{# prev and next are only show if a symbol has been passed. #}
{% if prev != None -%}
<li class="page-item {% if not pagination.has_prev %}disabled{% endif %}">
<a class="page-link" data-page="{%if pagination.has_prev%}{{pagination.prev_num}}{%else%}#{%endif%}" href="#">{{ prev }}</a>
</li>
{% endif %}
{% for page in pagination.iter_pages() %}
{% if page %}
{% if page != pagination.page %}
<li class="page-item">
<a class="page-link" href="#" data-page="{{page}}">{{ page }}</a>
</li>
{% else %}
<li class="page-item active">
<a class="page-link" data-page="{{page}}" href="#">{{ page }} <span class="sr-only">(current)</span></a>
</li>
{% endif %}
{% elif ellipses != None %}
<li class="page-item disabled"><a class="page-link" href="#">{{ ellipses }}</a></li>
{% endif %}
{% endfor %}
{% if next != None %}
<li class="page-item {% if not pagination.has_next %}disabled{% endif %}">
<a class="page-link" data-page="{% if pagination.has_next%}{{pagination.next_num}}{%else%}#{%endif%}" href="#">{{ next }}</a>
</li>
{% endif %}
</ul>
</nav>
{% endmacro %}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment