From 848aa0b0980cec86cf5dc5873cb5afc9f0a04e73 Mon Sep 17 00:00:00 2001
From: Jeremy Stretch <jstretch@digitalocean.com>
Date: Fri, 4 Jan 2019 11:07:55 -0500
Subject: [PATCH] Closes #1870: Add per-page toggle to object lists

---
 CHANGELOG.md                              |  1 +
 netbox/netbox/settings.py                 |  8 ++++++++
 netbox/project-static/css/base.css        |  3 +++
 netbox/project-static/js/forms.js         |  5 +++++
 netbox/templates/inc/paginator.html       |  9 +++++++-
 netbox/templates/responsive_table.html    |  3 ---
 netbox/templates/utilities/obj_table.html | 25 +++++++++++++----------
 7 files changed, 39 insertions(+), 15 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 683090ceb..3406e5497 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,7 @@ v2.5.3 (FUTURE)
 ## Enhancements
 
 * [#1630](https://github.com/digitalocean/netbox/issues/1630) - Enable bulk editing of prefix/IP mask length
+* [#1870](https://github.com/digitalocean/netbox/issues/1870) - Add per-page toggle to object lists
 * [#1871](https://github.com/digitalocean/netbox/issues/1871) - Enable filtering sites by parent region
 * [#2693](https://github.com/digitalocean/netbox/issues/2693) - Additional cable colors
 * [#2726](https://github.com/digitalocean/netbox/issues/2726) - Include cables in global search
diff --git a/netbox/netbox/settings.py b/netbox/netbox/settings.py
index 8651c3d26..e50e9bd72 100644
--- a/netbox/netbox/settings.py
+++ b/netbox/netbox/settings.py
@@ -246,6 +246,14 @@ LOGIN_URL = '/{}login/'.format(BASE_PATH)
 # Secrets
 SECRETS_MIN_PUBKEY_SIZE = 2048
 
+# Pagination
+PER_PAGE_DEFAULTS = [
+    25, 50, 100, 250, 500, 1000
+]
+if PAGINATE_COUNT not in PER_PAGE_DEFAULTS:
+    PER_PAGE_DEFAULTS.append(PAGINATE_COUNT)
+    PER_PAGE_DEFAULTS = sorted(PER_PAGE_DEFAULTS)
+
 # Django filters
 FILTERS_NULL_CHOICE_LABEL = 'None'
 FILTERS_NULL_CHOICE_VALUE = 'null'
diff --git a/netbox/project-static/css/base.css b/netbox/project-static/css/base.css
index 155dd21b7..ad1b02e3f 100644
--- a/netbox/project-static/css/base.css
+++ b/netbox/project-static/css/base.css
@@ -140,6 +140,9 @@ table.attr-table td:nth-child(1) {
 div.paginator {
     margin-bottom: 20px;
 }
+div.paginator form {
+    margin-bottom: 6px;
+}
 nav ul.pagination {
     margin-top: 0;
     margin-bottom: 8px !important;
diff --git a/netbox/project-static/js/forms.js b/netbox/project-static/js/forms.js
index fa23f1592..a1b2fca60 100644
--- a/netbox/project-static/js/forms.js
+++ b/netbox/project-static/js/forms.js
@@ -1,5 +1,10 @@
 $(document).ready(function() {
 
+    // Pagination
+    $('select#per_page').change(function() {
+        this.form.submit();
+    });
+
     // "Toggle" checkbox for object lists (PK column)
     $('input:checkbox.toggle').click(function() {
         $(this).closest('table').find('input:checkbox[name=pk]').prop('checked', $(this).prop('checked'));
diff --git a/netbox/templates/inc/paginator.html b/netbox/templates/inc/paginator.html
index 27d04c15c..e7be9eddb 100644
--- a/netbox/templates/inc/paginator.html
+++ b/netbox/templates/inc/paginator.html
@@ -1,6 +1,6 @@
 {% load helpers %}
 
-<div class="paginator pull-right">
+<div class="paginator pull-right text-right">
     {% if paginator.num_pages > 1 %}
         <nav>
             <ul class="pagination pull-right">
@@ -19,6 +19,13 @@
                 {% endif %}
             </ul>
         </nav>
+        <form method="get">
+            <select name="per_page" id="per_page">
+                {% for n in settings.PER_PAGE_DEFAULTS %}
+                    <option value="{{ n }}"{% if page.paginator.per_page == n %} selected="selected"{% endif %}>{{ n }}</option>
+                {% endfor %}
+            </select> per page
+        </form>
     {% endif %}
     {% if page %}
         <div class="text-right text-muted">
diff --git a/netbox/templates/responsive_table.html b/netbox/templates/responsive_table.html
index 81d9126fd..a6aaf5a6f 100644
--- a/netbox/templates/responsive_table.html
+++ b/netbox/templates/responsive_table.html
@@ -3,6 +3,3 @@
 <div class="table-responsive">
     {% render_table table 'inc/table.html' %}
 </div>
-{% with paginator=table.paginator page=table.page %}
-    {% include 'inc/paginator.html' %}
-{% endwith %}
diff --git a/netbox/templates/utilities/obj_table.html b/netbox/templates/utilities/obj_table.html
index 058c7ef07..8c5e3b8be 100644
--- a/netbox/templates/utilities/obj_table.html
+++ b/netbox/templates/utilities/obj_table.html
@@ -28,19 +28,22 @@
             </div>
         {% endif %}
         {% include table_template|default:'responsive_table.html' %}
-        {% block extra_actions %}{% endblock %}
-        {% if bulk_edit_url and permissions.change %}
-            <button type="submit" name="_edit" formaction="{% url bulk_edit_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-warning btn-sm">
-                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> Edit Selected
-            </button>
-        {% endif %}
-        {% if bulk_delete_url and permissions.delete %}
-            <button type="submit" name="_delete" formaction="{% url bulk_delete_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-danger btn-sm">
-                <span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Delete Selected
-            </button>
-        {% endif %}
+        <div class="pull-left">
+            {% block extra_actions %}{% endblock %}
+            {% if bulk_edit_url and permissions.change %}
+                <button type="submit" name="_edit" formaction="{% url bulk_edit_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-warning btn-sm">
+                    <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span> Edit Selected
+                </button>
+            {% endif %}
+            {% if bulk_delete_url and permissions.delete %}
+                <button type="submit" name="_delete" formaction="{% url bulk_delete_url %}{% if request.GET %}?{{ request.GET.urlencode }}{% endif %}" class="btn btn-danger btn-sm">
+                    <span class="glyphicon glyphicon-trash" aria-hidden="true"></span> Delete Selected
+                </button>
+            {% endif %}
+        </div>
     </form>
 {% else %}
     {% include table_template|default:'responsive_table.html' %}
 {% endif %}
+    {% include 'inc/paginator.html' with paginator=table.paginator page=table.page %}
 <div class="clearfix"></div>