[PATCH 26/51] dynatable: Allow the user to have pre-defined pagination links

[Damien Lespiau]

We want two things to have the layout generated by dynatable look like
the existing design:

 - Have two pagination widgets. For that we need to make
   dynatable-pagination-links + element.id a class and not an id. This
   is to allow multiple widgets

 - The second part is to re-use elements that are already in the DOM is
   the user put them there.

Signed-off-by: Damien Lespiau <damien.lespiau at intel.com>
---
 lib/packages/jquery/jquery.dynatable.js | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/lib/packages/jquery/jquery.dynatable.js b/lib/packages/jquery/jquery.dynatable.js
index de04547..7397110 100644
--- a/lib/packages/jquery/jquery.dynatable.js
+++ b/lib/packages/jquery/jquery.dynatable.js
@@ -382,7 +382,7 @@
         $('#dynatable-record-count-' + obj.element.id).replaceWith(obj.recordsCount.create());
       }
       if (settings.features.paginate) {
-        $('#dynatable-pagination-links-' + obj.element.id).replaceWith(obj.paginationLinks.create());
+        $('.dynatable-pagination-links-' + obj.element.id).replaceWith(obj.paginationLinks.create());
         if (settings.features.perPageSelect) {
           $('#dynatable-per-page-' + obj.element.id).val(parseInt(settings.dataset.perPage));
         }
@@ -1387,7 +1387,7 @@
     };
 
     this.create = function() {
-      var pageLinks = '<ul id="' + 'dynatable-pagination-links-' + obj.element.id + '" class="' + settings.inputs.paginationClass + '">',
+      var pageLinks = '<ul class="' + 'dynatable-pagination-links-' + obj.element.id + ' ' + settings.inputs.paginationClass + '">',
           pageLinkClass = settings.inputs.paginationLinkClass,
           activePageClass = settings.inputs.paginationActiveClass,
           disabledPageClass = settings.inputs.paginationDisabledClass,
@@ -1439,7 +1439,7 @@
       pageLinks += '</ul>';
 
       // only bind page handler to non-active and non-disabled page links
-      var selector = '#dynatable-pagination-links-' + obj.element.id + ' a.' + pageLinkClass + ':not(.' + activePageClass + ',.' + disabledPageClass + ')';
+      var selector = '.dynatable-pagination-links-' + obj.element.id + ' a.' + pageLinkClass + ':not(.' + activePageClass + ',.' + disabledPageClass + ')';
       // kill any existing delegated-bindings so they don't stack up
       $(document).undelegate(selector, 'click.dynatable');
       $(document).delegate(selector, 'click.dynatable', function(e) {
@@ -1471,6 +1471,11 @@
     };
 
     this.attach = function() {
+      // if the user already has elements in the page, use them instead of
+      // creating our own
+      if ($('.dynatable-pagination-links-' + obj.element.id).length)
+          return;
+
       // append page links *after* delegate-event-binding so it doesn't need to
       // find and select all page links to bind event
       var $target = settings.inputs.paginationLinkTarget ? $(settings.inputs.paginationLinkTarget) : obj.$element;
-- 
2.1.0