Attachment 117123 Details for Bug 27725 – Bug 27725: Use JavaScript to set history state during patron search

[patch] Bug 27725: Use JavaScript to set history state during patron search

Bug-27725-Use-JavaScript-to-set-history-state-duri.patch (text/plain), 4.58 KB, created by Owen Leonard on 2021-02-21 15:34:17 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: Owen Leonard

Created: 2021-02-21 15:34:17 UTC

Size: 4.58 KB

patch

obsolete

>From 88b99dca3d34d74a967d0a97db577d1c1f39ed71 Mon Sep 17 00:00:00 2001
>From: Owen Leonard <oleonard@myacpl.org>
>Date: Thu, 18 Feb 2021 16:37:37 +0000
>Subject: [PATCH] Bug 27725: Use JavaScript to set history state during patron
> search
>
>This patch modifies the patron search page so that clicks on the "Browse
>by last name" letters add an entry to the browser history, allowing the
>user to click back and forth from results while preserving their search.
>
>To test, apply the patch and go to Patrons in the staff interface.
>
>- Click one of the "Browse by last name" letters.
>- The table of search results should load the correct data.
>- In the browser's location bar you should see a query string added to
>  the URL, e.g. /cgi-bin/koha/members/members-home.pl?firstletter=Q
>- Click another letter.
>- Click the back button. You should be returned to the search results
>  for your first letter choice.
>- Clicking the forward button should work correctly as well.
>- Other patron searches (header search, sidebar search) should continue
>  to work as expected.
>
>EDIT: Clear single-letter querystring history item if only one result
>was returned.
>---
> .../prog/en/modules/members/member.tt              | 30 ++++++++++++++++++----
> 1 file changed, 25 insertions(+), 5 deletions(-)
>
>diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt
>index 2ab9c823a2..5cd93fc367 100644
>--- a/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt
>+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/members/member.tt
>@@ -195,6 +195,13 @@
>     [% Asset.js("lib/hc-sticky.js") | $raw %]
>     [% Asset.js("js/members-menu.js") | $raw %]
>     <script>
>+        var dtMemberResults;
>+        var search = 1;
>+        /* popstate event triggered by forward and back button. Need to refresh search */
>+        window.addEventListener('popstate', (event) => {
>+            getSearchByLocation();
>+        });
>+
>         $(document).ready(function() {
>             $('#merge-patrons').prop('disabled', true);
>             $('#memberresultst').on('change', 'input.selection', function() {
>@@ -312,11 +319,6 @@
>             });
>             $("#searchform").on("submit", filter);
> 
>-        });
>-
>-        var dtMemberResults;
>-        var search = 1;
>-        $(document).ready(function() {
>             [% IF searchmember %]
>                 $("#searchmember_filter").val("[% searchmember | html %]");
>             [% END %]
>@@ -419,6 +421,8 @@
>                             // redirect if there is only 1 result.
>                             if ( json.aaData.length == 1 ) {
>                                 var borrowernumber = json.aaData[0].borrowernumber;
>+                                /* remove any search string added by firstletter search since only one result was returned */
>+                                history.pushState( {}, null, window.location.href.split("?" )[0]);
>                                 document.location.href="/cgi-bin/koha/members/moremember.pl?borrowernumber="+borrowernumber;
>                                 return false;
>                             }
>@@ -461,8 +465,21 @@
>                 }
>             }, columns_settings);
>             update_searched();
>+            /* Initial page load doesn't trigger the popstate event, so we explicitly call this */
>+            getSearchByLocation();
>+
>         });
> 
>+        function getSearchByLocation(){
>+            if( location.search != ""){
>+                var params = new URLSearchParams( location.search );
>+                var firstletter = params.get("firstletter");
>+                if( firstletter ){
>+                    filterByFirstLetterSurname( firstletter );
>+                }
>+            }
>+        }
>+
>         // Update the string "Results found ..."
>         function update_searched(){
>             var searched = $("#searchfieldstype_filter").find("option:selected").text();
>@@ -502,6 +519,8 @@
>             $("#firstletter_filter").val('');
>             $("#searchmember_filter").val('');
>             if(redraw) {
>+                /* remove any search string added by firstletter search */
>+                history.pushState( {}, null, window.location.href.split("?" )[0]);
>                 search = 1;
>                 $("#searchresults").show();
>                 dtMemberResults.fnDraw();
>@@ -512,6 +531,7 @@
>         function filterByFirstLetterSurname(letter) {
>             clearFilters(false);
>             $("#firstletter_filter").val(letter);
>+            history.pushState( null, null, "?firstletter=" + letter );
>             update_searched();
>             search = 1;
>             $("#searchresults").show();
>-- 
>2.11.0

Actions: View | Diff | Splinter Review

Attachments on bug 27725: 117009 | 117123 | 123881 | 123913 | 125683 | 125821