fix pushState pagination

Using `$('.pagination')` everywhere in javascript was causing issues
because that returns two elements. This was especially true when
triggering events as it was triggering two events so the data was being
loaded twice. This was also resulting in resetting the page to the
initial page so clicking the back button would always return to the
first page of results.

This also sets `use_page` when clicking the back button otherwise it
also loads the initial page.

2 files changed, 8 insertions, 7 deletions

diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js
index 6caea3f4c..a7df18187 100644
--- a/web/cobrands/fixmystreet/fixmystreet.js
+++ b/web/cobrands/fixmystreet/fixmystreet.js
@@ -1280,7 +1280,7 @@ $(function() {
                     if (fixmystreet.utils && fixmystreet.utils.parse_query_string) {
                         var qs = fixmystreet.utils.parse_query_string();
                         var page = qs.p || 1;
-                        $('.pagination').data('page', page)
+                        $('.pagination:first').data('page', page)
                             .trigger('change.filters');
                     }
                     fixmystreet.display.reports_list(location.href);
@@ -1289,7 +1289,8 @@ $(function() {
                 } else if ('newReportAtLonlat' in e.state) {
                     fixmystreet.display.begin_report(e.state.newReportAtLonlat, false);
                 } else if ('page_change' in e.state) {
-                    $('.pagination').data('page', e.state.page_change.page)
+                    fixmystreet.markers.protocol.use_page = true;
+                    $('.pagination:first').data('page', e.state.page_change.page) //;
                         .trigger('change.filters');
                     if ( fixmystreet.page != 'reports' ) {
                         fixmystreet.display.reports_list(location.href);
diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js
index 645e5114e..281940aca 100644
--- a/web/js/map-OpenLayers.js
+++ b/web/js/map-OpenLayers.js
@@ -387,7 +387,7 @@ $.extend(fixmystreet.utils, {
         }
         var qs = fixmystreet.utils.parse_query_string();
 
-        var page = $('.pagination').data('page');
+        var page = $('.pagination:first').data('page');
         if (page > 1) {
             qs.p = page;
         } else {
@@ -643,11 +643,11 @@ $.extend(fixmystreet.utils, {
             $('.js-pagination').on('change.filters', categories_or_status_changed);
             $('.js-pagination').on('click', 'a', function(e) {
                 e.preventDefault();
-                var page = $('.pagination').data('page');
+                var page = $('.pagination:first').data('page');
                 if ($(this).hasClass('next')) {
-                    $('.pagination').data('page', page + 1);
+                    $('.pagination:first').data('page', page + 1);
                 } else {
-                    $('.pagination').data('page', page - 1);
+                    $('.pagination:first').data('page', page - 1);
                 }
                 fixmystreet.markers.protocol.use_page = true;
                 $(this).trigger('change');
@@ -916,7 +916,7 @@ OpenLayers.Protocol.FixMyStreet = OpenLayers.Class(OpenLayers.Protocol.HTTP, {
         });
         var page;
         if (this.use_page) {
-            page = $('.pagination').data('page');
+            page = $('.pagination:first').data('page');
             this.use_page = false;
         } else if (this.initial_page) {
             page = 1;