netbox-community-netbox/netbox/templates/inc/paginator.html

{% load helpers %}

<div class="paginator float-end text-end">
    {% if paginator.num_pages > 1 %}
    <div class="btn-group btn-group-sm mb-3" role="group" aria-label="Pages">    
    {% if page.has_previous %}
        <a href="{% querystring request page=page.previous_page_number %}" class="btn btn-outline-secondary">
            <i class="mdi mdi-chevron-double-left"></i>
        </a>
    {% endif %}
    {% for p in page.smart_pages %}
        {% if p %}
        <a href="{% querystring request page=p %}" class="btn btn-outline-secondary{% if page.number == p %} active{% endif %}">
            {{ p }}
        </a>
        {% else %}
        <button type="button" class="btn btn-outline-secondary" disabled>
            <span>&hellip;</span>
        </button>
        {% endif %}
    {% endfor %}
    {% if page.has_next %}
        <a href="{% querystring request page=page.next_page_number %}" class="btn btn-outline-secondary">
            <i class="mdi mdi-chevron-double-right"></i>
        </a>
    {% endif %}
    </div>
    {% endif %}
    <form method="get" class="mb-2">
        {% for k, v_list in request.GET.lists %}
            {% if k != 'per_page' %}
                {% for v in v_list %}
                    <input type="hidden" name="{{ k }}" value="{{ v }}" />
                {% endfor %}
            {% endif %}
        {% endfor %}
        <div class="input-group input-group-sm">
            <select name="per_page" class="form-select per-page">
            {% for n in page.paginator.get_page_lengths %}
                <option value="{{ n }}"{% if page.paginator.per_page == n %} selected="selected"{% endif %}>{{ n }}</option>
            {% endfor %}
            </select>
            <label class="input-group-text" for="per_page">Per Page</label>
        </div>
    </form>
    {% if page %}
    <small class="text-end text-muted">
        Showing {{ page.start_index }}-{{ page.end_index }} of {{ page.paginator.count }}
    </small>
    {% endif %}
</div>