Bug 30622: Patron search when placing hold should redirect if cardnumber is entered
[koha.git] / koha-tmpl / intranet-tmpl / prog / en / includes / patron-search.inc
1 [% USE Koha %]
2 [% USE I18N %]
3 [% USE Branches %]
4 [% USE raw %]
5 [% USE Asset %]
6 [% USE To %]
7
8 [%# Display a simple form %]
9 [% BLOCK patron_search_filters_simple  %]
10     <form id="patron_search_form">
11         <div class="hint">Enter patron card number or partial name:</div>
12         <input type="text" size="40" id="search_patron_filter" class="focus" autocomplete="off" />
13         <input type="submit" value="Search" />
14     </form>
15 [% END %]
16
17 [%# Display a complex patron search form %]
18 [%# - Search: <input> %]
19 [%# You can then pass a list of filters %]
20 [%# - branch: <select library list> %]
21 [%# - category: <select patron category list> %]
22 [%# - search_field: <select patron field list> %]
23 [%# - search_type: <select "contain" or "start with"> %]
24 [% BLOCK patron_search_filters %]
25     <form id="patron_search_form">
26         <fieldset class="brief">
27             <h3>Search for patron</h3>
28             <ol>
29                 <li>
30                     <label for="search_patron_filter">Search:</label>
31                     <input type="text" id="search_patron_filter" value="[% search_filter | html %]" class="focus" />
32                 </li>
33
34                 [% FOR f IN filters %]
35                     [% SWITCH f %]
36                     [% CASE 'branch' %]
37                         <li>
38                             <label for="branchcode_filter">Library:</label>
39                             <select id="branchcode_filter">
40                                 [% SET libraries = Branches.all( only_from_group => 1 ) %]
41                                 [% IF libraries.size != 1 %]
42                                     <option value="">Any</option>
43                                 [% END %]
44                                 [% FOREACH l IN libraries %]
45                                     <option value="[% l.branchcode | html %]">[% l.branchname | html %]</option>
46                                 [% END %]
47                             </select>
48                         </li>
49                     [% CASE 'category' %]
50                         <li>
51                             <label for="categorycode_filter">Category:</label>
52                             <select id="categorycode_filter">
53                                 <option value="">Any</option>
54                                 [% FOREACH category IN categories %]
55                                     <option value="[% category.categorycode | html %]">[% category.description | html %]</option>
56                                 [% END %]
57                             </select>
58                         </li>
59                     [% CASE 'search_field' %]
60                         <li>
61                             <label for="searchfieldstype_filter">Search field:</label>
62                             <select name="searchfieldstype" id="searchfieldstype_filter">
63                                 [% SET standard = Koha.Preference('DefaultPatronSearchFields') || 'firstname,surname,othernames,cardnumber,userid' %]
64                                 [% default_fields = [ standard, 'surname', 'cardnumber', 'email', 'borrowernumber', 'userid', 'phone', 'address', 'dateofbirth', 'sort1', 'sort2' ] %]
65                                 [% search_options = default_fields.merge(standard.split(',')).unique %]
66                                 [% FOREACH s_o IN search_options %]
67                                     [% display_name = PROCESS patron_fields name=s_o %]
68                                     [% NEXT IF !display_name %]
69                                     [% IF searchfieldstype == s_o %]
70                                         <option selected="selected" value=[% s_o | html %]>[% display_name | $raw %]</option>
71                                     [% ELSE %]
72                                         <option value=[% s_o | html %]>[% display_name | $raw %]</option>
73                                     [% END %]
74                                 [% END %]
75                             </select>
76                         </li>
77                     [% CASE 'search_type' %]
78                         <li>
79                             <label for="searchtype_filter">Search type:</label>
80                             <select name="searchtype" id="searchtype_filter">
81                               [% IF searchtype == "start_with" %]
82                                 <option value='start_with' selected="selected">Starts with</option>
83                                 <option value="contain">Contains</option>
84                               [% ELSE %]
85                                 <option value='start_with'>Starts with</option>
86                                 <option value="contain" selected="selected">Contains</option>
87                               [% END %]
88                             </select>
89                         </li>
90                     [% END %]
91                 [% END %]
92             </ol>
93             <fieldset class="action">
94                 <input type="submit" value="Search" />
95                 <input type="button" value="Clear" id="clear_search" />
96             </fieldset>
97         </fieldset>
98     </form>
99 [% END %]
100
101 [%# Display the table with: %]
102 [%# - At the top a hint about a possible filter %]
103 [%# - Browse by last name %]
104 [%# - The table %]
105 [%# Get the following parameters: %]
106 [%# - filter: can be 'suggestions_managers', 'orders_managers', 'funds_owners' or 'funds_users' to filter patrons on their permissions %]
107 [%# - table_id: the ID of the table %]
108 [%# open_on_row_click: See patron_search_js %]
109 [%# columns: See patron_search_js %]
110 [% BLOCK patron_search_table %]
111
112     [% IF filter == 'suggestions_managers' %]
113         <div class="hint">Only staff with superlibrarian or suggestions_manage permissions are returned in the search results</div>
114     [% ELSIF filter == 'orders_managers' %]
115         <div class="hint">Only staff with superlibrarian or acquisitions permissions (or order_manage permission if granular permissions are enabled) are returned in the search results</div>
116     [% ELSIF filter == 'funds_owners' OR filter == 'funds_users' %]
117         <div class="hint">Only staff with superlibrarian or acquisitions permissions (or budget_modify permission if granular permissions are enabled) are returned in the search results</div>
118     [% END %]
119
120     <div class="browse">
121         Browse by last name:
122         [% SET alphabet = Koha.Preference('alphabet').split(' ') %]
123         [% UNLESS alphabet.size %]
124             [% alphabet = ['A' .. 'Z'] %]
125         [% END %]
126         [% FOREACH letter IN alphabet %]
127             <a href="#" class="filterByLetter">[% letter | html %]</a>
128         [% END %]
129     </div>
130
131
132     <h3 style="display: none;">Patrons found for: <span id="searchpattern"></span></h3>
133
134     <div id="[% table_id | html %]_search_results" style="display:none;">
135
136         <div id="info" class="dialog message" style="display: none;"></div>
137         <div id="error" class="dialog alert" style="display: none;"></div>
138
139         <input type="hidden" id="firstletter_filter" value="" />
140         [% IF open_on_row_click %]
141         <table id="[% table_id | html %]" class="selections-table">
142         [% ELSE %]
143         <table id="[% table_id | html %]">
144         [% END %]
145             <thead>
146                 <tr>
147                     [% FOR column IN columns %]
148                         [% SWITCH column %]
149                             [% CASE 'checkbox' %]<th class="noExport"></th>
150                             [% CASE 'cardnumber' %]<th>Card</th>
151                             [% CASE 'dateofbirth' %]<th>Date of birth</th>
152                             [% CASE 'name' %]<th>Name</th>
153                             [% CASE 'name-address' %]<th>Name</th>
154                             [% CASE 'address' %]<th>Address</th>
155                             [% CASE 'address-library' %]<th>Address</th>
156                             [% CASE 'branch' %]<th data-filter="libraries">Library</th>
157                             [% CASE 'category' %]<th data-filter="categories">Category</th>
158                             [% CASE 'dateexpiry' %]<th>Expires on</td>
159                             [% CASE 'borrowernotes' %]<th>Notes</th>
160                             [% CASE 'phone' %]<th>Phone</th>
161                             [% CASE 'checkouts' %]<th>Checkouts</th>
162                             [% CASE 'account_balance' %]<th>Fines</th>
163                             [% CASE 'action' %]<th>&nbsp;</th>
164                         [% END %]
165                     [% END %]
166                 </tr>
167               </thead>
168             <tbody></tbody>
169         </table>
170     </div>
171
172 <!-- Patron preview modal -->
173 <div class="modal" id="patronPreview" tabindex="-1" role="dialog" aria-labelledby="patronPreviewLabel">
174     <div class="modal-dialog" role="document">
175         <div class="modal-content">
176             <div class="modal-header">
177                 <button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
178                 <h4 class="modal-title" id="patronPreviewLabel"></h4>
179             </div>
180             <div class="modal-body">
181                 <div id="loading">
182                     <img src="[% interface | html %]/[% theme | html %]/img/spinner-small.gif" alt="" /> Loading
183                 </div>
184             </div>
185             <div class="modal-footer">
186                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
187             </div>
188         </div>
189     </div>
190 </div>
191
192 [% END %]
193
194 [%# Integrate all the JS code, outside of a script tag %]
195 [%# Get the following parameters: %]
196 [%# - redirect_if_one_result: Redirect to the patron if the search returns only one result, note that it will not redirect if filters of the DT are used (this is a feature) %]
197 [%# - redirect_url: The URL to use, the borrowernumber parameter will be added %]
198 [%# - redirect_if_attribute_equal: Name of the attribute to use for the redirect. Query using this attribute, before the normal search %]
199 [%# filter: Same as patron_search_table %]
200 [%# open_on_row_click: boolean, default off. Will allow to select a patron by clicking on the whole tr element %]
201 [%# columns: list of columns that will be displayed. Possible values are: 'checkbox', 'cardnumber', 'dateofbirth', 'address', 'name', 'name-address', 'branch', 'category', 'dateexpiry', 'borrowernotes, 'phone', 'checkouts', 'account_balance', 'action' %]
202 [%# preview_on_name_click: Open a modal window with patron's info when the name is clicked %]
203 [%# actions: list of buttons to display in the action column. Possible values are: 'select', 'add', 'edit', 'checkout' %]
204 [%# sticky_header and sticky_to: If we need a sticky header %]
205 [%# callback: name of the JS function that will be called when a patron is selected. Only work with action=select %]
206 [%# display_search_description: boolean, default off. Display the description of the search %]
207 [% BLOCK patron_search_js %]
208
209     [% IF redirect_if_one_result && !redirect_url %]
210         <script>console.log("Wrong call of patron_searh_js - missing redirect_url");</script>
211     [% END %]
212     <script>
213         let categories = [% To.json(categories) | $raw %].map(e => {
214             e['_id'] = e.categorycode;
215             e['_str'] = e.description;
216             return e;
217         });
218         let categories_map = categories.reduce((map, e) => {
219             map[e._id] = e;
220             return map;
221         }, {});
222         let libraries  = [% To.json(libraries) | $raw %].map(e => {
223             e['_id'] = e.branchcode;
224             e['_str'] = e.branchname;
225             return e;
226         });
227         let libraries_map = libraries.reduce((map, e) => {
228             map[e._id] = e;
229             return map;
230         }, {});
231
232         [% IF Koha.Preference('ExtendedPatronAttributes') && extended_attribute_types %]
233             let extended_attribute_types = [% To.json(extended_attribute_types || []) | $raw %];
234         [% END %]
235
236     </script>
237
238     [% INCLUDE 'datatables.inc' %]
239     [% INCLUDE 'js-date-format.inc' %]
240     [% INCLUDE 'js-patron-get-age.inc' %]
241     [% INCLUDE 'js-patron-format.inc' %]
242     [% INCLUDE 'js-patron-format-address.inc' %]
243     [% IF sticky_header %]
244         [% Asset.js("lib/hc-sticky.js") | $raw %]
245     [% END %]
246
247     <script>
248         var first_draw = 0;
249         let patrons_table;
250         var Sticky;
251         var singleBranchMode = '[% singleBranchMode | html %]';
252         let logged_in_library_id = "[% Branches.GetLoggedInBranchcode | html %]";
253         [% IF do_not_defer_loading %]
254             let defer_loading = 0;
255         [% ELSE %]
256             let defer_loading = 1;
257         [% END %]
258
259         /* popstate event triggered by forward and back button. Need to refresh search */
260         window.addEventListener('popstate', (event) => {
261             getSearchByLocation( false );
262         });
263
264         [% SWITCH filter %]
265         [% CASE 'suggestions_managers' %]
266             let patron_search_url = '/api/v1/suggestions/managers';
267         [% CASE 'baskets_managers' %]
268             let patron_search_url = '/api/v1/acquisitions/baskets/managers';
269         [% CASE 'funds_owners' %]
270             let patron_search_url = '/api/v1/acquisitions/funds/owners';
271         [% CASE 'funds_users' %]
272             let patron_search_url = '/api/v1/acquisitions/funds/users';
273         [% CASE %]
274             let patron_search_url = '/api/v1/patrons';
275         [% END %]
276         $(document).ready(function(){
277
278             $("#info").hide();
279             $("#error").hide();
280
281             // Build the aLengthMenu
282             var aLengthMenu = [
283                 [% Koha.Preference('PatronsPerPage') | html %], 10, 20, 50, 100, -1
284             ];
285             jQuery.unique(aLengthMenu);
286             aLengthMenu.sort(function( a, b ){
287                 // Put "All" at the end
288                 if ( a == -1 ) {
289                     return 1;
290                 } else if ( b == -1 ) {
291                     return -1;
292                 }
293                 return parseInt(a) < parseInt(b) ? -1 : 1;}
294             );
295             var aLengthMenuLabel = [];
296             $(aLengthMenu).each(function(){
297                 if ( this == -1 ) {
298                     // Label for -1 is "All"
299                     aLengthMenuLabel.push(_("All"));
300                 } else {
301                     aLengthMenuLabel.push(this);
302                 }
303             });
304
305             let additional_filters = {
306                 surname: function(){
307                     let start_with = $("#firstletter_filter").val()
308                     if (!start_with) return "";
309                     return { "like": start_with + "%" }
310                 },
311                 "-and": function(){
312                     let filter = $("#search_patron_filter").val();
313                     if (!filter) return "";
314
315                     let filters = [];
316                     let search_type = $("#searchtype_filter").val() || "contain";
317                     let search_fields = $("#searchfieldstype_filter").val();
318                     if ( !search_fields ) {
319                         search_fields = "[% Koha.Preference('DefaultPatronSearchFields') || 'firstname,surname,othernames,cardnumber,userid' | html %]";
320                     }
321                     search_fields.split(',').forEach(function(e,i){
322                         filters.push({["me."+e]:{"like":(search_type == "contain" ? "%" : "" ) + filter + "%"}});
323                     });
324                     [% IF Koha.Preference('ExtendedPatronAttributes') && extended_attribute_types %]
325                         filters.push({
326                             "extended_attributes.value": { "like": "%" + filter + (search_type == "contain" ? "%" : "" )},
327                             "extended_attributes.code": extended_attribute_types
328                         });
329                     [% END %]
330                     return filters;
331                 }
332             };
333
334             [% UNLESS default_sort_column %]
335                 [% default_sort_column = "name" %]
336             [% END %]
337             [% SET order_column_index = 0 %]
338             [% SET embed = ['extended_attributes'] %]
339             patrons_table = $("#[% table_id | html %]").kohaTable({
340                 "ajax": {
341                     "url": patron_search_url,
342                     "dataSrc": function ( json ) {
343                         [% IF redirect_if_one_result %]
344                             // redirect if there is only 1 result.
345                             if ( first_draw && json.recordsFiltered == 1 ) {
346                                 let url = '[% redirect_url | url %]'.indexOf("?") != -1
347                                     ? '[% redirect_url | url %]&borrowernumber=' + json.data[0].patron_id
348                                     : '[% redirect_url | url %]?borrowernumber=' + json.data[0].patron_id;
349                                 document.location.href = url;
350                                 return false;
351                             }
352                             first_draw = 0;
353                         [% END %]
354                         return json.data;
355                     }
356                 },
357                 [% IF open_on_row_click OR preview_on_name_click %]
358                 "drawCallback": function( settings ) {
359                     var api = this.api();
360                     var data = api.data();
361                     if ( data.length == 0 ) return;
362
363                     [% IF open_on_row_click %]
364                     $.each($(this).find("tbody tr"), function(index, tr) {
365                         let url = "[% on_click_url | url %]&borrowernumber=" + data[index].patron_id;
366                         $(tr).off('click').on('click', function() {
367                             document.location.href = url;
368                         }).addClass('clickable');
369                         $(tr).find("a.patron_name").attr('href', url);
370                     });
371                     [% END %]
372                     [% IF preview_on_name_click %]
373                     $.each($(this).find("tbody tr"), function(index, tr) {
374                         $(tr).find("a.patron_name").addClass("patron_preview");
375                     });
376                     [% END %]
377                 },
378                 [% END %]
379                 "iDeferLoading": defer_loading,
380                 "columns": [
381                     [% FOR column IN columns %]
382                         [% IF default_sort_column == column %]
383                             [% order_column_index = loop.count - 1%]
384                         [% END %]
385                         [% SWITCH column %]
386                             [% CASE 'checkbox' %]
387                             {
388                                 "data": "patron_id",
389                                 "searchable": false,
390                                 "orderable": false,
391                                 "render": function( data, type, row, meta ) {
392                                     return "<label for='check" + data + "' class='content_hidden'>" + _("Select patron") + "</label><input type='checkbox' id='check" + data + "' class='selection' name='borrowernumber' value='" + data + "' />";
393                                 }
394                             }
395                             [% CASE 'cardnumber' %]
396                             {
397                                 "data": "cardnumber",
398                                 "searchable": true,
399                                 "orderable": true,
400                                 "render": function( data, type, row, meta ) {
401                                     let patron_id = encodeURIComponent(row.patron_id);
402                                     [% IF !open_on_row_click AND CAN_user_circulate_circulate_remaining_permissions %]
403                                         return "<a href=\"/cgi-bin/koha/circ/circulation.pl?borrowernumber=" + patron_id + "\" title=\"[% I18N.t("Check out") | html %]\" class=\"patron_name\" data-borrowernumber=\"" + patron_id + "\" style=\"white-space:nowrap\">" + escape_str(data) + "</a>";
404                                     [% ELSE %]
405                                         return escape_str(data);
406                                     [% END %]
407                                 }
408
409                             }
410                             [% CASE 'dateofbirth' %]
411                             {
412                                 "data": "date_of_birth",
413                                 "searchable": true,
414                                 "orderable": true,
415                                 "render": function( data, type, row, meta ) {
416                                     return data ? escape_str($date(data) + " (" + _("%s years").format($get_age(data)) + ")") : "";
417                                 }
418                             }
419                             [% CASE 'address' %]
420                             {
421                                 "data": "me.street_number:me.address:me.address2:me.city:me.state:me.postal_code:me.country",
422                                 "searchable": true,
423                                 "orderable": true,
424                                  "render": function( data, type, row, meta ) {
425                                     let r = '<div class="address"><ul>';
426                                     r += $format_address(row, { no_line_break: 1 });
427                                     r += '</div></ul>';
428                                     return r;
429                                 }
430                             }
431                             [% CASE 'address-library' %]
432                             {
433                                 "data": "me.street_number:me.address:me.address2:me.city:me.state:me.postal_code:me.country",
434                                 "searchable": true,
435                                 "orderable": true,
436                                 "render": function( data, type, row, meta ) {
437                                     let r = '<div class="address"><ul>';
438                                     r += $format_address(row, { no_line_break: 1 });
439                                     r += '</div></ul>';
440                                     r += " " + escape_str(libraries_map[row.library_id].branchname);
441                                     return r;
442                                 }
443                             }
444                             [% CASE 'name-address' %]
445                             {
446                                 "data": "me.surname:me.firstname:me.othernames:me.street_number:me.address:me.address2:me.city:me.state:me.postal_code:me.country",
447                                 "searchable": true,
448                                 "orderable": true,
449                                 "render": function( data, type, row, meta ) {
450                                     let patron_id = encodeURIComponent(row.patron_id);
451                                     let r = '';
452                                     [% IF ! open_on_row_click %]
453                                     r += "<a href=\"/cgi-bin/koha/members/moremember.pl?borrowernumber=" + patron_id + "\" class=\"patron_name\" data-borrowernumber=\"" + patron_id + "\" style=\"white-space:nowrap\">" + $patron_to_html(row, { invert_name: 1 }) + "</a>";
454                                     [% ELSE %]
455                                     r += $patron_to_html(row, { invert_name: 1 });
456                                     [% END %]
457                                     r += '<br/>';
458                                     r += '<div class="address"><ul>';
459                                     r += $format_address(row, { no_line_break: 1 });
460
461                                     if ( row.email ) {
462                                         r += "<li>" + _("Email: ") + "<a href='mailto:" + encodeURIComponent(row.email) + "'>" + escape_str(row.email) + "</a></li>";
463                                     }
464                                     r += '</ul></div>'
465
466                                     return r;
467                                 }
468                             }
469                             [% CASE 'name-address' %]
470                             {
471                                 "data": "me.surname:me.firstname:me.othernames:me.street_number:me.address:me.address2:me.city:me.state:me.postal_code:me.country",
472                                 "searchable": true,
473                                 "orderable": true,
474                                 "render": function( data, type, row, meta ) {
475                                     let patron_id = encodeURIComponent(row.patron_id);
476                                     let r = '';
477                                     [% IF ! open_on_row_click %]
478                                     r += "<a href=\"/cgi-bin/koha/members/moremember.pl?borrowernumber=" + patron_id + "\" class=\"patron_name\" data-borrowernumber=\"" + patron_id + "\" style=\"white-space:nowrap\">" + $patron_to_html(row, { invert_name: 1 }) + "</a>";
479                                     [% ELSE %]
480                                     r += $patron_to_html(row, { invert_name: 1 });
481                                     [% END %]
482                                     r += '<br/>';
483                                     r += '<div class="address"><ul>';
484                                     r += $format_address(row, { no_line_break: 1 });
485
486                                     if ( row.email ) {
487                                         r += "<li>" + _("Email: ") + "<a href='mailto:" + encodeURIComponent(row.email) + "'>" + escape_str(row.email) + "</a></li>";
488                                     }
489                                     r += '</ul></div>'
490
491                                     return r;
492                                 }
493                             }
494                             [% CASE 'name' %]
495                             {
496                                 "data": "me.surname:me.firstname:me.othernames",
497                                 "searchable": true,
498                                 "orderable": true,
499                                 "render": function( data, type, row, meta ) {
500                                     let patron_id = encodeURIComponent(row.patron_id);
501                                     [% IF ! open_on_row_click %]
502                                     return "<a href=\"/cgi-bin/koha/members/moremember.pl?borrowernumber=" + patron_id + "\" class=\"patron_name\" data-borrowernumber=\"" + patron_id + "\" style=\"white-space:nowrap\">" + $patron_to_html(row, { invert_name: 1 }) + "</a>";
503                                     [% ELSE %]
504                                     return $patron_to_html(row, { invert_name: 1 });
505                                     [% END %]
506                                 }
507                             }
508                             [% CASE 'branch' %]
509                             {
510                                 "data": "library_id",
511                                 "searchable": true,
512                                 "orderable": true,
513                                 "render": function( data, type, row, meta ) {
514                                     let library_name = libraries_map[data].branchname
515                                     if( !singleBranchMode && data == logged_in_library_id ) {
516                                         return "<span class=\"currentlibrary\">" + escape_str(library_name) + "</span>";
517                                     } else {
518                                         return escape_str(library_name);
519                                     }
520                                 }
521                             }
522                             [% CASE 'category' %]
523                             {
524                                 "data": "category_id",
525                                 "searchable": true,
526                                 "orderable": true,
527                                 "render": function( data, type, row, meta ) {
528                                     return escape_str(categories_map[data].description);
529                                 }
530                             }
531                             [% CASE 'dateexpiry' %]
532                             {
533                                 "data": "expiry_date",
534                                 "searchable": true,
535                                 "orderable": true,
536                                 "render": function( data, type, row, meta ) {
537                                     return data ? escape_str($date(data)) : "";
538                                 }
539                             }
540                             [% CASE 'borrowernotes' %]
541                             {
542                                 "data": "staff_notes",
543                                 "searchable": true,
544                                 "orderable": true,
545                                 [%# We don't escape here, we allow html tag in staff notes %]
546                             }
547                             [% CASE 'phone' %]
548                             {
549                                 "data": "phone",
550                                 "searchable": true,
551                                 "orderable": true,
552                                 "render": function( data, type, row, meta ) {
553                                     return escape_str(data);
554                                 }
555                             }
556                             [% CASE 'checkouts' %][% embed.push('checkouts+count', 'overdues+count') %]
557                             {
558                                 "data": "",
559                                 "searchable": false,
560                                 "orderable": false,
561                                 "render": function( data, type, row, meta ) {
562                                     if ( row.overdues_count ) {
563                                         return "<span class='overdue'><strong>"+row.overdues_count + "</strong></span>";
564                                     } else {
565                                         return "0 / " + row.checkouts_count;
566                                     }
567                                 }
568                             }
569                             [% CASE 'account_balance' %][% embed.push('account_balance') %]
570                             {
571                                 "data": "",
572                                 "searchable": false,
573                                 "orderable": false,
574                                 "render": function( data, type, row, meta ) {
575                                     let r = "<span style='text-align: right; display: block;'><a href=\"/cgi-bin/koha/members/boraccount.pl?borrowernumber="+row.patron_id+"\">";
576                                     let balance_str = row.account_balance || 0;
577                                     balance_str = balance_str.escapeHtml().format_price();
578                                     if ( row.account_balance < 0 ) {
579                                         // FIXME Format price here
580                                         r += "<span class='credit'>" + balance_str + "</span>";
581                                     } else if ( row.account_balance > 0 ) {
582                                         r += "<span class='debit'><strong>" + balance_str  + "</strong></span>"
583                                     } else {
584                                         r += balance_str;
585                                     }
586                                     r += "</a></span>";
587                                     return r;
588                                 }
589                             }
590
591                             [% CASE 'action' %]
592                             {
593                                 "data": function( row, type, val, meta ) {
594
595                                     let patron_id = encodeURIComponent(row.patron_id);
596                                     let action_node = "";
597                                     [% FOR action IN actions %]
598                                     [% SWITCH action %]
599                                     [% CASE 'select' %]
600                                         action_node += '<a href="#" class="btn btn-default btn-xs select_user" data-borrowernumber="' + patron_id + '">Select</a><input type="hidden" id="borrower_data' + patron_id + '" name="borrower_data'+ patron_id + '" value=\''+JSON.stringify(row)+'\' />';
601                                     [% CASE 'add' %]
602                                         action_node += '<a href="#" class="btn btn-default btn-xs add_user" data-borrowernumber="' + patron_id + '" data-firstname="' + encodeURIComponent(row.firstname) + '" data-surname="' + encodeURIComponent(row.surname) + '">Add</a><input type="hidden" id="borrower_data' + patron_id + '" name="borrower_data'+ patron_id + '" />';
603                                     [% CASE 'edit' %]
604                                         action_node += '<a href="/cgi-bin/koha/members/memberentry.pl?op=modify&amp;destination=circ&amp;borrowernumber=' + patron_id + '" class="btn btn-default btn-xs"><i class="fa fa-pencil"></i> Edit</a>';
605                                     [% CASE 'checkout' %]
606                                         [% IF CAN_user_circulate_circulate_remaining_permissions %]
607                                             action_node += '<a class="btn btn-default btn-xs" href="/cgi-bin/koha/circ/circulation.pl?borrowernumber=' + patron_id + '"><i class="fa fa-barcode"></i> ' + _("Check out") + '</a>';
608                                         [% END %]
609                                     [% END %]
610                                     [% END %]
611                                     return action_node;
612                                 },
613                                 "searchable": false,
614                                 "orderable": false
615                             }
616                         [% END %]
617                         [% UNLESS loop.last %],[% END %]
618                     [% END %]
619                 ],
620                 'embed': [% To.json(embed) | $raw %],
621                 "order": [[ [% order_column_index | html %], "asc" ]],
622                 'bAutoWidth': false,
623                 'lengthMenu': [aLengthMenu, aLengthMenuLabel],
624                 'sPaginationType': 'full_numbers',
625                 "pageLength": [% Koha.Preference('PatronsPerPage') | html %],
626                 [% IF sticky_header %]
627                 "initComplete": function(settings, json) {
628                     $("#[% sticky_header | html %]").show();
629                     Sticky = $("#[% sticky_header | html %]");
630                     Sticky.hcSticky({
631                         stickTo: "#[% sticky_to | html %]",
632                         stickyClass: "floating"
633                     });
634                 },
635                 [% END %]
636             }, typeof table_settings !== 'undefined' ? table_settings : null, 1, additional_filters);
637
638             $("#patron_search_form").on('submit', filter);
639             $(".filterByLetter").on("click",function(e){
640                 e.preventDefault();
641                 filterByFirstLetterSurname($(this).text(), true);
642             });
643             $("body").on("click",".add_user",function(e){
644                 e.preventDefault();
645                 var borrowernumber = $(this).data("borrowernumber");
646                 var firstname = $(this).data("firstname");
647                 var surname = $(this).data("surname");
648                 add_user( borrowernumber, firstname + " " + surname );
649             });
650
651             $("body").on("click",".select_user",function(e){
652                 e.preventDefault();
653                 var borrowernumber = $(this).data("borrowernumber");
654                 var borrower_data = $("#borrower_data"+borrowernumber).val();
655                 select_user( borrowernumber, JSON.parse(borrower_data) );
656             });
657
658             $("body").on("click",".patron_preview", function( e ){
659                 e.preventDefault();
660                 var borrowernumber = $(this).data("borrowernumber");
661                 var page = "/cgi-bin/koha/members/moremember.pl?print=brief&borrowernumber=" + borrowernumber;
662                 $("#patronPreview .modal-body").load( page + " div.container-fluid" );
663                 $('#patronPreview').modal({show:true});
664             });
665
666             $("#patronPreview").on('hidden.bs.modal', function (e) {
667                 $("#patronPreview .modal-body").html("<img src=\"[% interface | html %]/[% theme | html %]/img/spinner-small.gif\" alt=\"\" /> Loading");
668             });
669
670             $("#clear_search").on("click",function(e){
671                 e.preventDefault();
672                 clearFilters();
673                 $("#searchpattern").parent().hide();
674             });
675
676             if ( !defer_loading ) {
677                 $("#patron_search_form").submit();
678             }
679
680             /* Initial page load does not trigger the popstate event, so we explicitly call this */
681             getSearchByLocation( false );
682
683         });
684
685         function getSearchByLocation( setstate ){
686             /* Check to see if the URL contains a search parameter */
687             if( location.search != ""){
688                 var params = new URLSearchParams( location.search );
689                 var firstletter = params.get("firstletter");
690                 /* Check to see if search is a first letter param */
691                 if( firstletter ){
692                     /* Trigger function to return search results by letter */
693                     filterByFirstLetterSurname( firstletter, setstate );
694                 }
695             }
696         }
697
698         function update_search_description(){
699             var searched = $("#searchfieldstype_filter").find("option:selected").text();
700             if ( $("#search_patron_filter").val() ) {
701                 if ( $("#searchtype_filter").val() == 'start_with' ) {
702                     searched += _(" starting with ");
703                 } else {
704                     searched += _(" containing ");
705                 }
706                 searched += "'" + $("#search_patron_filter").val() + "'";
707             }
708             if ( $("#firstletter_filter").val() ) {
709                 searched += _(" begins with ") + "'" + $("#firstletter_filter").val() +"'";
710             }
711             if ( $("#categorycode_filter").val() ) {
712                 searched += _(" with category ") + "'" + $("#categorycode_filter").find("option:selected").text() + "'";
713             }
714             if ( $("#branchcode_filter").val() ) {
715                 searched += _(" in library ") + $("#branchcode_filter").find("option:selected").text();
716             }
717             $("#searchpattern").text(searched);
718             $("#searchpattern").parent().show();
719         }
720
721         function filter() {
722             [% IF redirect_if_attribute_equal %]
723                 let filter = $("#search_patron_filter").val();
724                 if ( filter ) {
725                     $.ajax({
726                         data: { cardnumber: filter, _match: 'exact' },
727                         type: 'GET',
728                         url: patron_search_url,
729                         success: function(data) {
730                             if ( data.length == 1 ) {
731                                 let url = '[% redirect_url | url %]'.indexOf("?") != -1
732                                     ? '[% redirect_url | url %]&borrowernumber=' + data[0].patron_id
733                                     : '[% redirect_url | url %]?borrowernumber=' + data[0].patron_id;
734                                 document.location.href = url;
735                                 return false;
736                             }
737                         },
738                         error: function() {
739                             alert( _("An error occurred. Check the logs") );
740                         }
741                     });
742                 }
743             [% END %]
744             $("#firstletter_filter").val('');
745             $("#[% table_id | html %]_search_results").show();
746
747             let table_dt = patrons_table.DataTable();
748             [% FOR c IN columns %]
749                 [% SWITCH c %]
750                 [% CASE 'branch' %]
751                     library_id = $("#branchcode_filter").val() || "";
752                     patrons_table.find('thead tr:eq(1) th[data-filter="libraries"] select').val(library_id);
753                     table_dt.column([% loop.count - 1 %]).search(library_id ? '^'+library_id+'$' : '');
754                 [% CASE 'category' %]
755                     let category_id = $("#categorycode_filter").val() || "";
756                     patrons_table.find('thead tr:eq(1) th[data-filter="categories"] select').val(category_id);
757                     table_dt.column([% loop.count - 1 %]).search(category_id ? '^'+category_id+'$' : '');
758                 [% END %]
759             [% END %]
760             table_dt.search("");
761             first_draw = 1; // Only redirect if we are coming from here
762             table_dt.draw();
763             [% IF display_search_description %]
764                 update_search_description();
765             [% END %]
766             return false;
767         }
768
769         function clearFilters() {
770             $("#searchfieldstype_filter option:first").prop("selected", true);
771             $("#searchtype_filter option[value='contain']").prop("selected", true);
772             $("#categorycode_filter option:first").prop("selected", true);
773             $("#branchcode_filter option:first").prop("selected", true);
774             $("#firstletter_filter").val('');
775             $("#search_patron_filter").val('');
776             /* remove any search string added by firstletter search */
777             history.pushState( {}, null, window.location.href.split("?" )[0]);
778             $("#[% table_id | html %]_search_results").hide();
779             [% IF display_search_description %]
780                 update_search_description();
781             [% END %]
782         }
783
784         // User has clicked on a letter
785         function filterByFirstLetterSurname(letter, setstate ) {
786             $("#firstletter_filter").val(letter);
787
788             $("#[% table_id | html %]_search_results").show();
789
790             if ( setstate ) {
791                 history.pushState( null, null, "?firstletter=" + letter );
792             }
793
794             patrons_table.DataTable().draw();
795             [% IF display_search_description %]
796                 update_search_description();
797             [% END %]
798         }
799
800         // modify parent window owner element
801         function add_user(borrowernumber, borrowername) {
802             var p = window.opener;
803             // In one place (serials/routing.tt), the page is reload on every add
804             // We have to wait for the page to be there
805             function wait_for_opener () {
806                 if ( ! $(opener.document).find('body').size() ) {
807                     setTimeout(wait_for_opener, 500);
808                 } else {
809                     [%# Note that add_user could sent data instead of borrowername too %]
810                     $("#info").hide();
811                     $("#error").hide();
812                     if ( p.add_user(borrowernumber, borrowername) < 0 ) {
813                         $("#error").html(_("Patron '%s' is already in the list.").format(borrowername));
814                         $("#error").show();
815                     } else {
816                         $("#info").html(_("Patron '%s' added.").format(borrowername));
817                         $("#info").show();
818                     }
819                 }
820             }
821             wait_for_opener();
822         }
823         function select_user(borrowernumber, data) {
824             var p = window.opener;
825             [%  IF callback %]
826                 p.[% callback | html %](borrowernumber, data);
827             [%  ELSE %]
828                 p.select_user(borrowernumber, data);
829             [%  END %]
830             window.close();
831         }
832     </script>
833 [% END %]