Support pagination with multiple forms (#349)

Support pagination with multiple forms

Allow to specify the HTML form id even when the pagination is not a
child of the form.

CHANGELOG.md

@@ -2,6 +2,7 @@
 
 ## 4.14.0
 * Allow Serveradmin apps to extend the Servershell (Javascript) [PR!348](https://github.com/innogames/serveradmin/pull/348)
+* Support pagination with multiple forms [PR!349](https://github.com/innogames/serveradmin/pull/349)
 
 ## 4.13.0
 * Extend inet attributes and improve ip address type validation [PR!346](https://github.com/innogames/serveradmin/pull/346)

serveradmin/common/static/js/serveradmin.js

@@ -6,7 +6,7 @@ $(document).ready(function() {
     }
 
     // This is our progress spinner we can call e.g. spinner.enable() from
-    // everywhere when ever we need it for example when doing long running
+    // everywhere when ever we need it for example when doing long-running
     // ajax requests for the servershell search.
     window.spinner = {
         _timers: {},
@@ -43,7 +43,15 @@ $(document).ready(function() {
     // submitting the links.
     $('.pagination.form a').each(function(index, anchor) {
         anchor.onclick = function(event) {
-            let form = this.closest('form');
+            let form = null;
+            let formId = this.closest('.pagination').dataset.formId;
+            if (formId) {
+                form = document.getElementById(formId);
+            }
+            else {
+                this.closest('form');
+            }
+
             if (form) {
                 event.preventDefault();
 

serveradmin/common/templates/pagination.html

@@ -1,9 +1,14 @@
-{# Usage: {% include "pagination.html" with page=obj form=False %} #}
+{# Usage expamples: #}
+{# {% include "pagination.html" with page=obj form=False %} #}
+{# {% include "pagination.html" with page=obj form=True %} #}
+{# {% include "pagination.html" with page=obj form=True form_id="myform" %} #}
 
-{# Set form parameter to True to make the pagination controls find the #}
-{# form it is enclosed and submit it with the page parameter appended. #}
+{# Set form parameter to True to make the pagination controls find the form it #}
+{# is enclosed and submit it with the page parameter appended. If there are #}
+{# multiple forms you can set form_id to the HTML id of the form that should #}
+{# get submitted. #}
 
-<div class="pagination {% if form %}form{% endif %}">
+<div class="pagination {% if form %}form{% endif %}" {% if form_id %}data-form-id="{{ form_id }}"{% endif %}>
     <span class="step-links">
         {% if page.has_previous %}
             <a href="?page=1">&laquo; first</a>