[Koha-patches] [PATCH] Bug 11671 - Restructure patron lists add form for improved usability

Owen Leonard oleonard at myacpl.org
Mon Feb 3 20:33:47 CET 2014


Non-standard interface features have the potential to cause confusion.
This patch brings various aspects of the patron lists add page into
conformity with other staff client pages.

- Add "select all/clear all" links for the checkboxes
- Add a "remove selected" to the top of the table (see also Lists)
- Split functionality of add from from delete form
- Hide "Add patrons" button until at least one patron has been selected
- Remove non-standard trash can icon from table's checkbox column
- Exclude checkbox column from table sorting
- Add confirmation to deletion actions
- Improve breadcrumb specificity
- Add title-string sorting to date column to accommodate sorting for all
  date format types

To test, apply the patch and create a patron list.

1. Search for and select patrons for the list. Selecting a patron should
   trigger the display of an "Add patrons" button.
2. Click "Add patrons" and confirm that the add process completes
   correctly.
3. Search for and select a patron and also check the box next to an
   existing patron. Click "Add patrons" and confirm that no patron is
   removed.
4. Check that the "select all" and "clear all" links work correctly.
5. Select patrons on the list and click the "Remove selected" link. You
   should be prompted to confirm your choice.
   4.a. Click cancel and confirm that the deletion process aborts.
   4.b. Click OK and confirm that the deletion process completes.
6. Repeat step 4 with the "Remove selected patrons" at the bottom of the
   page.
7. Confirm that the page title and breadcrumbs correctly show the list
   name.
8. Switch between us and metric dateformat settings and confirm that
   table sorting by date is correct in both cases.
---
 .../intranet-tmpl/prog/en/css/staff-global.css     |    2 +-
 .../prog/en/modules/patron_lists/list.tt           |   73 ++++++++++++++++----
 2 files changed, 62 insertions(+), 13 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css b/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css
index 2ea7b4a..f1a59f1 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css
+++ b/koha-tmpl/intranet-tmpl/prog/en/css/staff-global.css
@@ -1441,7 +1441,7 @@ li.email {
      background-color : #E6F0F2;
 	font-size : 80%;
 	margin : 0 0 .5em -1px;
- padding : .1em 0 .4em 1em;
+    padding : .4em 0 .4em 1em;
      border-radius : 5px 5px 0 0;
    border : 1px solid #B9D8D9;
 }
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/patron_lists/list.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/patron_lists/list.tt
index b0717dd..3c9af82 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/patron_lists/list.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/patron_lists/list.tt
@@ -1,6 +1,6 @@
 [% USE KohaDates %]
 [% INCLUDE 'doc-head-open.inc' %]
-<title>Koha › Tools › Patron lists › New list</title>
+<title>Koha › Tools › Patron lists › [% list.name %] › Add patrons</title>
 [% INCLUDE 'doc-head-close.inc' %]
 
 <link rel="stylesheet" type="text/css" href="[% themelang %]/css/datatables.css" />
@@ -11,7 +11,14 @@
 $(document).ready(function() {
     $('#patrons_to_add_fieldset').hide();
 
-    $('#patron-list-table').dataTable($.extend(true, {}, dataTablesDefaults));
+        $('#patron-list-table').dataTable($.extend(true, {}, dataTablesDefaults, {
+            "aoColumns": [
+                null,null,null,null,null,null,null,{ "sType": "title-string" },null
+            ],
+            "aoColumnDefs": [
+                { "aTargets": [ 0 ], "bSortable": false, "bSearchable": false },
+            ]
+        } ));
 
     $( "#find_patron" ).autocomplete({
         source: "/cgi-bin/koha/circ/ysearch.pl",
@@ -27,6 +34,37 @@ $(document).ready(function() {
         .append( "<a>" + item.surname + ", " + item.firstname + " (" + item.cardnumber + ") <small>" + item.address + " " + item.city + " " + item.zipcode + " " + item.country + "</small></a>" )
         .appendTo( ul );
     };
+
+    var checkBoxes = $("input[type='checkbox']","#patron-list-table");
+
+    $("#CheckAll").click(function(e){
+        e.preventDefault();
+        checkBoxes.each(function(){
+            $(this).prop("checked",1);
+        });
+    });
+    $("#CheckNone").click(function(e){
+        e.preventDefault();
+        checkBoxes.each(function(){
+            $(this).prop("checked",0);
+        });
+    });
+
+    $("#remove_patrons").submit(function(){
+        var checkedItems = $("input:checked");
+        if ($(checkedItems).size() == 0) {
+            alert(_("You must select one or more patrons to remove"));
+            return false;
+        }
+        $(checkedItems).parents('tr').addClass("warn");
+        if( confirm(_("Are you sure you want to remove the selected patrons?")) ) {
+            return true;
+        } else {
+            $(checkedItems).parents('tr').removeClass("warn");
+            return false;
+        }
+    });
+
 });
 
 function AddPatron( name, cardnumber ) {
@@ -53,13 +91,13 @@ function RemovePatron( cardnumber ) {
 <body>
 [% INCLUDE 'header.inc' %]
 [% INCLUDE 'cat-search.inc' %]
-<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> › <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> › <a href="lists.pl">Patron lists</a> › Add patrons</div>
+<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> › <a href="/cgi-bin/koha/tools/tools-home.pl">Tools</a> › <a href="lists.pl">Patron lists</a> › <a href="/cgi-bin/koha/patron_lists/list.pl?patron_list_id=[% list.id %]">[% list.name %]</a> › Add patrons</div>
 
 <div class="yui-t7">
     <div class="yui-main">
         <h1>[% list.name %]</h1>
 
-        <form action="list.pl" method="post">
+        <form action="list.pl" id="add_patrons" method="post">
             <fieldset>
                 <legend>Add patrons</legend>
 
@@ -70,19 +108,31 @@ function RemovePatron( cardnumber ) {
                 <fieldset id="patrons_to_add_fieldset">
                     <legend>Patrons to be added</legend>
                     <div id="patrons_to_add"></div>
+
+                    <fieldset class="action">
+                        <input type="hidden" name="patron_list_id" value="[% list.patron_list_id %]" />
+                        <input type="submit" value="Add patrons" />
+                        <a href="lists.pl" class="cancel">Cancel</a>
+                    </fieldset>
                 </fieldset>
 
             </fieldset>
+        </form>
+
+        <form action="list.pl" id="remove_patrons" method="post">
 
-            <p>
-                <input type="submit" class="btn" value="Update" />
-                <a href="lists.pl" class="cancel">Cancel</a>
-            </p>
+            <div id="searchheader">
+                <span class="checkall"><a id="CheckAll" href="#">Select all</a></span> |
+                <span class="clearall"><a id="CheckNone" href="#">Clear all</a></span> |
+                <div class="btn-group">
+                    <button class="btn btn-mini list-remove" type="submit"><i class="icon-remove-sign"></i> Remove selected</button>
+                </div>
+            </div>
 
             <table id="patron-list-table">
                 <thead>
                     <tr>
-                        <th><i title="Remove patron from list" class="icon-trash"></i></th>
+                        <th> </th>
                         <th>Card</th>
                         <th>Firstname</th>
                         <th>Surname</th>
@@ -114,7 +164,7 @@ function RemovePatron( cardnumber ) {
                             </td>
                             <td>[% p.borrowernumber.categorycode.description %] ([% p.borrowernumber.categorycode.categorycode %])</td>
                             <td>[% p.borrowernumber.branchcode.branchname %]</td>
-                            <td>[% p.borrowernumber.dateexpiry | $KohaDates %]</td>
+                            <td><span title="[% p.borrowernumber.dateexpiry %]">[% p.borrowernumber.dateexpiry | $KohaDates %]</span></td>
                             <td>[% p.borrowernumber.borrowernotes %]</td>
                         </tr>
                     [% END %]
@@ -122,8 +172,7 @@ function RemovePatron( cardnumber ) {
             </table>
 
             <input type="hidden" name="patron_list_id" value="[% list.patron_list_id %]" />
-            <input type="submit" class="btn" value="Update" />
-            <a href="lists.pl" class="cancel">Cancel</a>
+            <input type="submit" value="Remove selected patrons" />
         </form>
     </div>
 </div>
-- 
1.7.9.5


More information about the Koha-patches mailing list