diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-account.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-account.tt
index 79efc3487a..be71917301 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-account.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-account.tt
@@ -86,112 +86,106 @@
     <script>
         const ENABLE_OPAC_PAYMENTS = [% ENABLE_OPAC_PAYMENTS ? 1 : 0 | html %];
     </script>
-
     <script>
-        $( document ).ready(function() {
-
+        $(document).ready(function () {
             var txtActivefilter = _("Filter paid transactions");
             var txtInactivefilter = _("Show all transactions");
 
             var fines_table = $("#finestable").kohaTable({
-                ...(ENABLE_OPAC_PAYMENTS
-                    ? {order: [[ 1, "desc" ]]}
-                    : {order: [[ 0, "desc" ]]}
-                ),
-                 dom: '<"#filter_p">',
-                 responsive: {
-                    details: { "type": 'column',"target": -1 }
-                 },
-                 columnDefs: [
-                    { className: 'dtr-control', orderable: false, targets: -1 }
-                 ],
-                 drawCallback: function() {
-                    show_hiddentfoot('#finestable');
-                 }
-            } );
+                ...(ENABLE_OPAC_PAYMENTS ? { order: [[1, "desc"]] } : { order: [[0, "desc"]] }),
+                dom: '<"#filter_p">',
+                responsive: {
+                    details: { type: "column", target: -1 },
+                },
+                columnDefs: [{ className: "dtr-control", orderable: false, targets: -1 }],
+                drawCallback: function () {
+                    show_hiddentfoot("#finestable");
+                },
+            });
 
             $('table[id^="finestable-"]').kohaTable({
-                 responsive: {
-                    details: { "type": 'column',"target": -1 }
-                 },
-                 columnDefs: [
-                    { className: 'dtr-control', orderable: false, targets: -1 }
-                 ],
-                 drawCallback: function() {
+                responsive: {
+                    details: { type: "column", target: -1 },
+                },
+                columnDefs: [{ className: "dtr-control", orderable: false, targets: -1 }],
+                drawCallback: function () {
                     show_hiddentfoot('table[id^="finestable-"]');
-                 }
+                },
             });
 
             function show_hiddentfoot(selector) {
-                $('.finestable tfoot .sum').show();
+                $(".finestable tfoot .sum").show();
                 if ($(".finestable tfoot td.dtr-hidden").length > 0) {
-                    $(selector+" tfoot th").removeAttr( "colspan" );
+                    $(selector + " tfoot th").removeAttr("colspan");
                     $(".finestable tfoot .dtr-control").hide();
                 }
             }
-            $("#filter_p").html('<p><a href="#" id="filter_paid"><i class="fa fa-filter" aria-hidden="true"></i> '+txtActivefilter+'</a>');
-            $('#filter_paid').click(function(e) {
+            $("#filter_p").html('<p><a href="#" id="filter_paid"><i class="fa fa-filter" aria-hidden="true"></i> ' + txtActivefilter + "</a>");
+            $("#filter_paid").click(function (e) {
                 e.preventDefault();
-                let filteredValue = '';
-                if ($(this).hasClass('filtered')) {
-                    $(this).html('<i class="fa fa-filter" aria-hidden="true"></i> '+txtActivefilter);
-                } else { //Not filtered. Let's do it!
-                    filteredValue = '^((?!0.00).*)$'; //Filter not matching 0.00 http://stackoverflow.com/a/406408
-                    $(this).html('<i class="fa fa-filter" aria-hidden="true"></i> '+txtInactivefilter);
+                let filteredValue = "";
+                if ($(this).hasClass("filtered")) {
+                    $(this).html('<i class="fa fa-filter" aria-hidden="true"></i> ' + txtActivefilter);
+                } else {
+                    //Not filtered. Let's do it!
+                    filteredValue = "^((?!0.00).*)$"; //Filter not matching 0.00 http://stackoverflow.com/a/406408
+                    $(this).html('<i class="fa fa-filter" aria-hidden="true"></i> ' + txtInactivefilter);
                 }
-                fines_table.DataTable().columns(-2).search(filteredValue, {regex: true}).draw();
-                $(this).toggleClass('filtered');
+                fines_table.DataTable().columns(-2).search(filteredValue, { regex: true }).draw();
+                $(this).toggleClass("filtered");
             });
 
             //Start filtered
-            $('#filter_paid').click();
+            $("#filter_paid").click();
 
             $(".pay-online").removeClass("hidden");
 
             $("#amount-to-pay-label").hide();
 
-            $(".checkbox-pay, input[name='payment_method']").change( function() {
+            $(".checkbox-pay, input[name='payment_method']").change(function () {
                 // Disable the pay button if no fees are selected
                 //$("#submit-pay").prop("disabled", ! $(".checkbox-pay:checked").length );
 
                 // Calculate the total amount to be paid based on selected fees
                 var total = 0;
-                $(".checkbox-pay").each( function() {
-                    if ( $(this).is(":checked") ) {
+                $(".checkbox-pay").each(function () {
+                    if ($(this).is(":checked")) {
                         var id = this.id.split("checkbox-pay-")[1];
-                        total += parseFloat( $("#amount-" + id).val() );
+                        total += parseFloat($("#amount-" + id).val());
                     }
                 });
 
                 var p = Promise.resolve();
-                if ( total ) {
+                if (total) {
                     p = Promise.all(
-                        $('input[name="payment_method"]').map(function() {
-                            var self = this;
-                            return new Promise(function(resolve, reject) {
-                                var threshold = $(self).data('threshold');
-                                var help = $(self).parent().siblings('.help-block');
-                                if(!threshold || threshold == '' || threshold <= total) {
-                                    $(self).prop('disabled', false);
-                                    help.addClass('hide');
-                                } else {
-                                    $(self).prop('disabled', true);
-                                    help.html( _("Minimum amount needed by this service is %s").format(parseInt(threshold,10).toFixed(2)) ).removeClass('hide');
-                                }
-                                resolve();
+                        $('input[name="payment_method"]')
+                            .map(function () {
+                                var self = this;
+                                return new Promise(function (resolve, reject) {
+                                    var threshold = $(self).data("threshold");
+                                    var help = $(self).parent().siblings(".help-block");
+                                    if (!threshold || threshold == "" || threshold <= total) {
+                                        $(self).prop("disabled", false);
+                                        help.addClass("hide");
+                                    } else {
+                                        $(self).prop("disabled", true);
+                                        help.html(_("Minimum amount needed by this service is %s").format(parseInt(threshold, 10).toFixed(2))).removeClass("hide");
+                                    }
+                                    resolve();
+                                });
                             })
-                        }).toArray()
+                            .toArray()
                     );
 
-                    $("#amount-to-pay").html( total.toFixed(2) );
+                    $("#amount-to-pay").html(total.toFixed(2));
                     $("#amount-to-pay-label").show();
                 } else {
-                    $('input[name="payment_method"]').prop('disabled', false).parent().siblings('.help-block').addClass('hide');
+                    $('input[name="payment_method"]').prop("disabled", false).parent().siblings(".help-block").addClass("hide");
                     $("#amount-to-pay-label").hide();
                 }
-                p.then(function() {
-                    $("#submit-pay").prop("disabled", ! $(".checkbox-pay:checked").length || ! $('input[name="payment_method"]:checked:not(:disabled)').length);
-                })
+                p.then(function () {
+                    $("#submit-pay").prop("disabled", !$(".checkbox-pay:checked").length || !$('input[name="payment_method"]:checked:not(:disabled)').length);
+                });
             });
         });
     </script>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-basket.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-basket.tt
index 878cbaaacb..2e666441f2 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-basket.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-basket.tt
@@ -446,13 +446,13 @@
     [% IF ( TagsInputEnabled && loggedinusername ) %]
         <script>
             function tagSelected() {
-                var bibs = document.getElementById('records').value;
+                var bibs = document.getElementById("records").value;
                 if (bibs) {
                     $("#tagsel_tag").hide();
                     $("#tag_hides").hide();
                     $("#tagsel_form").show();
                 } else {
-                    alert( _("No item was selected") );
+                    alert(_("No item was selected"));
                 }
             }
 
@@ -467,13 +467,13 @@
             function tagAdded() {
                 var checkedBoxes = $("input:checkbox:checked");
                 if (!$(checkedBoxes).size()) {
-                    alert( _("No item was selected") );
+                    alert(_("No item was selected"));
                     return false;
                 }
 
                 var tag = $("#tagsel_new").val();
-                if (!tag || (tag == "")) {
-                    alert( _("No tag was specified.") );
+                if (!tag || tag == "") {
+                    alert(_("No tag was specified."));
                     return false;
                 }
 
@@ -488,120 +488,118 @@
             }
         </script>
     [% END # / TagsInputEnabled && loggedinusername %]
-
     <script>
-        $(document).ready(function(){
-            $("a.bib_opener").on('click',function(){
+        $(document).ready(function () {
+            $("a.bib_opener").on("click", function () {
                 let link = this.dataset.link;
                 let biblionumber = this.dataset.biblionumber;
-                openBiblio(link,biblionumber)
+                openBiblio(link, biblionumber);
             });
 
-            $(".brief").click(function(e){
+            $(".brief").click(function (e) {
                 e.preventDefault();
                 showLess();
             });
 
-            $(".detail").click(function(e){
+            $(".detail").click(function (e) {
                 e.preventDefault();
                 showMore();
             });
 
-            $(".send").click(function(e){
+            $(".send").click(function (e) {
                 e.preventDefault();
                 sendBasket();
             });
 
-            $(".download-cart").on("click", function(e){
+            $(".download-cart").on("click", function (e) {
                 e.preventDefault();
                 var format = $(this).data("format");
-                $("#download_format").val( format );
+                $("#download_format").val(format);
                 $("#download_cart").submit();
             });
 
-            $(".empty").click(function(e){
+            $(".empty").click(function (e) {
                 e.preventDefault();
                 delBasket();
             });
 
-            $(".deleteshelf").click(function(e){
+            $(".deleteshelf").click(function (e) {
                 e.preventDefault();
                 delSelRecords();
             });
 
-            $(".newshelf").click(function(e){
+            $(".newshelf").click(function (e) {
                 e.preventDefault();
                 addSelToShelf();
             });
 
-            $(".hold").click(function(e){
+            $(".hold").click(function (e) {
                 e.preventDefault();
                 holdSel();
             });
 
-            $("#tagsel_tag").click(function(e){
+            $("#tagsel_tag").click(function (e) {
                 e.preventDefault();
                 tagSelected();
             });
 
-            $("#tagsel_button").click(function(e){
+            $("#tagsel_button").click(function (e) {
                 e.preventDefault();
                 tagAdded();
             });
 
-            $("#tagsel_cancel").click(function(e){
+            $("#tagsel_cancel").click(function (e) {
                 e.preventDefault();
                 tagCanceled();
             });
 
-            $("#CheckAll").click(function(e){
+            $("#CheckAll").click(function (e) {
                 e.preventDefault();
-                $(".cb").each(function(){
+                $(".cb").each(function () {
                     $(this).prop("checked", true);
                     selRecord(this.value, true);
                 });
                 enableCheckboxActions();
             });
 
-            $("#CheckNone").click(function(e){
+            $("#CheckNone").click(function (e) {
                 e.preventDefault();
-                $(".cb").each(function(){
+                $(".cb").each(function () {
                     $(this).prop("checked", false);
                     selRecord(this.value, false);
                 });
                 enableCheckboxActions();
             });
 
-            if( $("#itemst").length > 0 ){
+            if ($("#itemst").length > 0) {
                 var itemst = $("#itemst").kohaTable({
                     order: [[1, "asc"]],
                 });
 
                 var buttons = new $.fn.dataTable.Buttons(itemst, {
-                     buttons: [
-                        'print'
-                    ]
-                }).container().appendTo($('#toolbar'));
+                    buttons: ["print"],
+                })
+                    .container()
+                    .appendTo($("#toolbar"));
             }
 
-            $(".cb").change(function(){
-                selRecord( $(this).val(), $(this).prop("checked") );
+            $(".cb").change(function () {
+                selRecord($(this).val(), $(this).prop("checked"));
                 enableCheckboxActions();
                 return false;
             });
             enableCheckboxActions();
-
         });
 
-        function enableCheckboxActions(){
+        function enableCheckboxActions() {
             // Enable/disable controls if checkboxes are checked
             var checkedBoxes = $(".cb:checked");
-            if ( checkedBoxes.length ) {
-              $(".selections").html(_("With selected titles: "));
-              $(".selections-toolbar .links a").removeClass("disabled").attr("aria-disabled", "false");
+            if (checkedBoxes.length) {
+                $(".selections").html(_("With selected titles: "));
+                $(".selections-toolbar .links a").removeClass("disabled").attr("aria-disabled", "false");
             } else {
-              $(".selections").html(_("Select titles to: "));
-              $(".selections-toolbar .links a").addClass("disabled").attr("aria-disabled", "true");
+                $(".selections").html(_("Select titles to: "));
+                $(".selections-toolbar .links a").addClass("disabled").attr("aria-disabled", "true");
             }
         }
     </script>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-details.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-details.tt
index e9656388f1..8e1e970933 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-details.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-details.tt
@@ -144,10 +144,8 @@
             OPACTableColExpandedByDefault: [% Koha.Preference('OPACTableColExpandedByDefault') ? 1 : 0 | html %],
         });
     </script>
-
     <script>
-        $(document).ready(function() {
-
+        $(document).ready(function () {
             var responsive_display = prefs.OPACTableColExpandedByDefault ? DataTable.Responsive.display.childRowImmediate : DataTable.Responsive.display.childRow;
             $("#course-items-table").kohaTable(
                 {
@@ -161,12 +159,10 @@
                         details: {
                             display: responsive_display,
                             type: "column",
-                            target: -1
+                            target: -1,
                         },
                     },
-                    columnDefs: [
-                        { className: "dtr-control", orderable: false, targets: -1 },
-                    ],
+                    columnDefs: [{ className: "dtr-control", orderable: false, targets: -1 }],
                 },
                 table_settings
             );
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-reserves.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-reserves.tt
index 127fbce38f..cbce7b7fcf 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-reserves.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-course-reserves.tt
@@ -89,9 +89,8 @@
             OPACTableColExpandedByDefault: [% Koha.Preference('OPACTableColExpandedByDefault') ? 1 : 0 | html %],
         });
     </script>
-
     <script>
-        $(document).ready(function() {
+        $(document).ready(function () {
             var responsive_display = prefs.OPACTableColExpandedByDefault ? DataTable.Responsive.display.childRowImmediate : DataTable.Responsive.display.childRow;
             $("#course_reserves_table").kohaTable(
                 {
@@ -106,12 +105,10 @@
                         details: {
                             display: responsive_display,
                             type: "column",
-                            target: -1
+                            target: -1,
                         },
                     },
-                    cColumnDefs: [
-                        { className: "dtr-control", orderable: false, targets: -1 },
-                    ],
+                    cColumnDefs: [{ className: "dtr-control", orderable: false, targets: -1 }],
                 },
                 table_settings
             );
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-curbside-pickups.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-curbside-pickups.tt
index 90d7aae482..aed8c19a09 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-curbside-pickups.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-curbside-pickups.tt
@@ -326,20 +326,19 @@
             OPACTableColExpandedByDefault: [% Koha.Preference('OPACTableColExpandedByDefault') ? 1 : 0 | html %],
         });
     </script>
-
     <script>
         let existingPickupMoments = [];
-        pickups.forEach(function(pickup){
+        pickups.forEach(function (pickup) {
             let scheduled_pickup_datetime = pickup.scheduled_pickup_datetime;
             let pickupMoment = dayjs(scheduled_pickup_datetime);
 
-            if(!existingPickupMoments[pickup.branchcode]) existingPickupMoments[pickup.branchcode] = [];
+            if (!existingPickupMoments[pickup.branchcode]) existingPickupMoments[pickup.branchcode] = [];
             existingPickupMoments[pickup.branchcode].push(pickupMoment);
         });
 
         var responsive_display = prefs.OPACTableColExpandedByDefault ? DataTable.Responsive.display.childRowImmediate : DataTable.Responsive.display.childRow;
 
-        $(document).ready(function() {
+        $(document).ready(function () {
             $("#pickups-table").kohaTable({
                 searching: false,
                 paging: false,
@@ -348,13 +347,13 @@
                     details: {
                         display: responsive_display,
                         type: "column",
-                        target: -1
+                        target: -1,
                     },
                 },
                 columnDefs: [{ className: "dtr-control", orderable: false, targets: -1 }],
             });
-            $("#pickup-branch option").each(function(){
-                if ( $(this).val() != "" && !policies[$(this).val()].enabled ) {
+            $("#pickup-branch option").each(function () {
+                if ($(this).val() != "" && !policies[$(this).val()].enabled) {
                     $(this).prop("disabled", "disabled");
                     $(this).attr("title", _("You don't have waiting holds at this library"));
                 }
@@ -362,35 +361,36 @@
 
             const pickupDate_fp = document.getElementById("pickup-date")._flatpickr;
 
-            $('#pickup-branch').on('change', function() {
+            $("#pickup-branch").on("change", function () {
                 let branchcode = $(this).val();
 
                 let existing_pickup = pickup_exists_in.indexOf(branchcode) != -1;
 
-                $('#pickup-date').val("");
-                $('#pickup-time').val("");
-                $('#pickup-times').hide();
-                $('#schedule-pickup-button').prop('disabled', true);
+                $("#pickup-date").val("");
+                $("#pickup-time").val("");
+                $("#pickup-times").hide();
+                $("#schedule-pickup-button").prop("disabled", true);
 
                 if (existing_pickup) {
-                    $('#existing-pickup-warning').show();
+                    $("#existing-pickup-warning").show();
                     $("#pickup-date,#pickup_date_item,#pickup_notes_item").hide();
                 } else {
-                    $('#existing-pickup-warning').hide();
+                    $("#existing-pickup-warning").hide();
                     $("#pickup-date,#pickup_date_item").show();
                 }
 
-                pickupDate_fp.set('disable', [function(date) {
-                    return !policies[branchcode].slots_per_day.hasOwnProperty(date.getDay());
-                }]);
-
+                pickupDate_fp.set("disable", [
+                    function (date) {
+                        return !policies[branchcode].slots_per_day.hasOwnProperty(date.getDay());
+                    },
+                ]);
             });
 
-            pickupDate_fp.config.onClose.push(function( selectedDates, dateStr, instance ){
+            pickupDate_fp.config.onClose.push(function (selectedDates, dateStr, instance) {
                 /* Here we add an onClose event to the existing flatpickr instance */
                 /* It fires after the user has selected a date from the calendar popup */
-                $('#pickup-times').html("<label>" + _("Select a time") + ":</label><div id=\"pickup-time-slots\"></div>");
-                $('#schedule-pickup-button').prop( 'disabled', 1 );
+                $("#pickup-times").html("<label>" + _("Select a time") + ':</label><div id="pickup-time-slots"></div>');
+                $("#schedule-pickup-button").prop("disabled", 1);
 
                 var currentDate = dateStr;
                 let branchcode = $("#pickup-branch").val();
@@ -401,82 +401,82 @@
                 let pickupSlots = [];
                 let available_count = 0;
                 let dow = selectedDate.day(); // Sunday is 0 (at least for now)
-                if (!policy.slots_per_day[dow]){
-                    $('#pickup-times').html("<div>"+_("No pickup time defined for this day.")+"</div>");
+                if (!policy.slots_per_day[dow]) {
+                    $("#pickup-times").html("<div>" + _("No pickup time defined for this day.") + "</div>");
                     return;
                 }
 
-                policy.slots_per_day[dow].sort((a, b) => a.start_hour - b.start_hour).forEach(function(slot){
-                    let pickup_interval = policy.pickup_interval;
-                    if (!pickup_interval) {
-                        $('#pickup-times').html("<div>"+_("No pickup time defined for this day.")+"</div>");
-                        return;
-                    }
-
-                    let listStartMoment = selectedDate.hour(slot.start_hour).minute(slot.start_minute);
-                    let listEndMoment = selectedDate.hour(slot.end_hour).minute(slot.end_minute);
-
-                    let keep_going = true;
-                    let now = dayjs();
-
-                    // Initialize pickup slots starting at opening time
-                    let pickupIntervalStartMoment = listStartMoment;
-                    let pickupIntervalEndMoment   = listStartMoment.add(pickup_interval, 'minutes');
-                    while (keep_going) {
-                        let available = true;
-                        let display_slot = true;
-
-                        if (pickupIntervalStartMoment.isBefore(now)) {
-                            // Slots in the past are unavailable
-                            available = false;
-                            display_slot = false;
+                policy.slots_per_day[dow]
+                    .sort((a, b) => a.start_hour - b.start_hour)
+                    .forEach(function (slot) {
+                        let pickup_interval = policy.pickup_interval;
+                        if (!pickup_interval) {
+                            $("#pickup-times").html("<div>" + _("No pickup time defined for this day.") + "</div>");
+                            return;
                         }
 
-                        if (pickupIntervalEndMoment.isAfter(listEndMoment)) {
-                            // Slots after the end of pickup times for the day are unavailable
-                            available = false;
+                        let listStartMoment = selectedDate.hour(slot.start_hour).minute(slot.start_minute);
+                        let listEndMoment = selectedDate.hour(slot.end_hour).minute(slot.end_minute);
+
+                        let keep_going = true;
+                        let now = dayjs();
+
+                        // Initialize pickup slots starting at opening time
+                        let pickupIntervalStartMoment = listStartMoment;
+                        let pickupIntervalEndMoment = listStartMoment.add(pickup_interval, "minutes");
+                        while (keep_going) {
+                            let available = true;
+                            let display_slot = true;
+
+                            if (pickupIntervalStartMoment.isBefore(now)) {
+                                // Slots in the past are unavailable
+                                available = false;
+                                display_slot = false;
+                            }
+
+                            if (pickupIntervalEndMoment.isAfter(listEndMoment)) {
+                                // Slots after the end of pickup times for the day are unavailable
+                                available = false;
+                            }
+
+                            let pickups_scheduled = 0;
+
+                            if (existingPickupMoments[branchcode]) {
+                                existingPickupMoments[branchcode].forEach(function (pickupMoment) {
+                                    // An existing pickup time
+                                    if (pickupMoment.isSameOrAfter(pickupIntervalStartMoment) && pickupMoment.isBefore(pickupIntervalEndMoment)) {
+                                        // This calculated pickup is in use by another scheduled pickup
+                                        pickups_scheduled++;
+                                    }
+                                });
+                            }
+
+                            if (pickups_scheduled >= policy.patrons_per_interval) {
+                                available = false;
+                            }
+
+                            if (display_slot) {
+                                pickupSlots.push({
+                                    available: available,
+                                    moment: pickupIntervalStartMoment,
+                                    pickups_scheduled: pickups_scheduled,
+                                });
+                            }
+
+                            if (available) {
+                                available_count++;
+                            }
+
+                            pickupIntervalStartMoment = pickupIntervalEndMoment;
+                            pickupIntervalEndMoment = pickupIntervalStartMoment.add(pickup_interval, "minutes");
+                            if (pickupIntervalEndMoment.isAfter(listEndMoment)) {
+                                // This latest slot is after the end of pickup times for the day, so we can stop
+                                keep_going = false;
+                            }
                         }
 
-                        let pickups_scheduled = 0;
-
-                        if (existingPickupMoments[branchcode]){
-                            existingPickupMoments[branchcode].forEach(function(pickupMoment){
-                                // An existing pickup time
-                                if (pickupMoment.isSameOrAfter(pickupIntervalStartMoment) && pickupMoment.isBefore(pickupIntervalEndMoment)) {
-                                    // This calculated pickup is in use by another scheduled pickup
-                                    pickups_scheduled++;
-                                }
-                            });
-                        }
-
-                        if (pickups_scheduled >= policy.patrons_per_interval) {
-                            available = false;
-                        }
-
-                        if ( display_slot ) {
-                            pickupSlots.push(
-                                {
-                                    "available": available,
-                                    "moment": pickupIntervalStartMoment,
-                                    "pickups_scheduled": pickups_scheduled
-                                }
-                            );
-                        }
-
-                        if ( available ) {
-                            available_count++;
-                        }
-
-                        pickupIntervalStartMoment = pickupIntervalEndMoment;
-                        pickupIntervalEndMoment = pickupIntervalStartMoment.add(pickup_interval, 'minutes');
-                        if (pickupIntervalEndMoment.isAfter(listEndMoment)) {
-                            // This latest slot is after the end of pickup times for the day, so we can stop
-                            keep_going = false;
-                        }
-                    }
-
-                    $('#schedule-pickup-button').prop( 'disabled', available_count <= 0 );
-                });
+                        $("#schedule-pickup-button").prop("disabled", available_count <= 0);
+                    });
 
                 for (let i = 0; i < pickupSlots.length; i++) {
                     let pickupSlot = pickupSlots[i];
@@ -485,7 +485,11 @@
                     let pickups_scheduled = pickupSlot.pickups_scheduled;
                     let pickups_available = policy.patrons_per_interval - pickups_scheduled;
                     let disabled = pickupSlot.available ? "" : "disabled";
-                    $("#pickup-time-slots").append(`<span class="pickup_time"><input type="radio" id="slot_${i}" name="pickup_time" value="${optValue}" ${disabled} /> <label class="pickup_select" for="slot_${i}" data-bs-toggle="tooltip" title="` + _("Appointments available: ") + `${pickups_available}">${optText} <span class="pickups_available">${pickups_available}</span></label></span>`);
+                    $("#pickup-time-slots").append(
+                        `<span class="pickup_time"><input type="radio" id="slot_${i}" name="pickup_time" value="${optValue}" ${disabled} /> <label class="pickup_select" for="slot_${i}" data-bs-toggle="tooltip" title="` +
+                            _("Appointments available: ") +
+                            `${pickups_available}">${optText} <span class="pickups_available">${pickups_available}</span></label></span>`
+                    );
                 }
 
                 $("#pickup_notes_item,#pickup-times").show();
@@ -493,15 +497,15 @@
 
             $("#pickup_date_item,#pickup_notes_item,#pickup-times").hide();
 
-            $("#create-pickup").on('submit', function(){
-                if ( ! $("input[type='radio']:checked").length ) {
+            $("#create-pickup").on("submit", function () {
+                if (!$("input[type='radio']:checked").length) {
                     alert(_("Please select a date and a pickup time"));
                     return false;
                 }
                 return true;
             });
             $("#pickup-times").tooltip({
-                selector: ".pickup_select"
+                selector: ".pickup_select",
             });
         });
     </script>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
index 2b94b3d775..24c88fd40e 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-detail.tt
@@ -1700,7 +1700,6 @@
 
         const defaulttab = "[% defaulttab | html %]";
     </script>
-
     <script>
         window.emojiPicker = new EmojiPicker({
         emojiable_selector: '[data-emojiable=true]',
@@ -2261,7 +2260,6 @@
 
         }
     </script>
-
     [% IF ( NovelistSelectProfile && ( normalized_isbn || normalized_upc ) ) %]
         <script>
             $(document).ready(function() {
@@ -2282,5 +2280,4 @@
             });
         </script>
     [% END %]
-
 [% END %]
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt
index 9609c300f8..efa55435be 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt
@@ -193,30 +193,29 @@
     <script>
         const min_year = "[% yearmin | html %]";
     </script>
-
     <script>
-        $(document).ready(function(){
+        $(document).ready(function () {
             showlayer(min_year);
             $("a.tabsubs:first").addClass("currentsubtab");
-            $("#filterform").submit(function(){
+            $("#filterform").submit(function () {
                 filterByLibrary();
                 return false;
             });
-            $("#libraryfilter").change(function(){
+            $("#libraryfilter").change(function () {
                 filterByLibrary();
             });
-            $("#subscriptionidfilter").change(function(){
+            $("#subscriptionidfilter").change(function () {
                 filterBySubscriptionId();
             });
-            $("#reset").click(function(){
+            $("#reset").click(function () {
                 clearFilters();
             });
-            $("a.tabsubs").on("click", function(e){
+            $("a.tabsubs").on("click", function (e) {
                 e.preventDefault();
                 let year = $(this).data("year");
                 $("a.tabsubs").removeClass("currentsubtab");
                 $(this).addClass("currentsubtab");
-                showlayer( year );
+                showlayer(year);
             });
             $(".subscriptionstclass").kohaTable({
                 order: [[0, "desc"]],
@@ -230,73 +229,77 @@
 
             // Getting each branchcode from the currently displayed tab
             var subarray = [];
-            $("div#" + currentYear + " table.subscriptionstclass tbody tr:visible td.libraryfilterclass").each(function() {
-                if (subarray.indexOf($(this).text()) == -1) { subarray.push($(this).text()); }
+            $("div#" + currentYear + " table.subscriptionstclass tbody tr:visible td.libraryfilterclass").each(function () {
+                if (subarray.indexOf($(this).text()) == -1) {
+                    subarray.push($(this).text());
+                }
             });
 
             // Setting the option values with branchcodes
-            $("#libraryfilter").append('<option value="all">'+_("(All)")+'</option>');
+            $("#libraryfilter").append('<option value="all">' + _("(All)") + "</option>");
             for (var i = 0; i < subarray.length; i++) {
-                $("#libraryfilter").append('<option value="' + subarray[i] + '">' + subarray[i] + '</option>');
+                $("#libraryfilter").append('<option value="' + subarray[i] + '">' + subarray[i] + "</option>");
             }
         }
 
         // Filter by Library
         function filterByLibrary() {
-
             selectedStatus = $("#libraryfilter").val();
 
             // Reset the filters but keeps the selected library
             clearFilters(true);
 
-            if (selectedStatus != 'all') {
-
+            if (selectedStatus != "all") {
                 // We hide everything
-            $("table.subscriptionstclass tbody tr").hide();
+                $("table.subscriptionstclass tbody tr").hide();
 
-            // Then show the lines that match the currently selected library
-            $("table.subscriptionstclass tbody tr td.libraryfilterclass:contains(" + selectedStatus + ")").parent().show();
+                // Then show the lines that match the currently selected library
+                $("table.subscriptionstclass tbody tr td.libraryfilterclass:contains(" + selectedStatus + ")")
+                    .parent()
+                    .show();
 
+                // We then prepare the subscription filter :
 
-            // We then prepare the subscription filter :
+                // Getting subscription id's for the selected library
+                var subarray = [];
+                $("div#" + currentYear + " table.subscriptionstclass tbody tr:visible td.subscriptionidfilterclass").each(function () {
+                    if (subarray.indexOf($(this).text()) == -1) {
+                        subarray.push($(this).text());
+                    }
+                });
+                // Setting the option values with subscription id's
+                $("#subscriptionidfilter").append('<option value="all">' + _("(All)") + "</option>");
+                for (var i = 0; i < subarray.length; i++) {
+                    $("#subscriptionidfilter").append('<option value="' + subarray[i] + '">' + subarray[i] + "</option>");
+                }
 
-            // Getting subscription id's for the selected library
-            var subarray = [];
-            $("div#" + currentYear + " table.subscriptionstclass tbody tr:visible td.subscriptionidfilterclass").each(function() {
-                if (subarray.indexOf($(this).text()) == -1) { subarray.push($(this).text()); }
-            });
-            // Setting the option values with subscription id's
-            $("#subscriptionidfilter").append('<option value="all">'+_("(All)")+'</option>');
-            for (var i = 0; i < subarray.length; i++) {
-                $("#subscriptionidfilter").append('<option value="' + subarray[i] + '">' + subarray[i] + '</option>');
-            }
-
-            // Subscription filtering is now ready
-            $("#subscriptionidfilter").removeAttr("disabled");
+                // Subscription filtering is now ready
+                $("#subscriptionidfilter").removeAttr("disabled");
             }
         }
 
         // Filter by subscription id
         function filterBySubscriptionId() {
-
             selectedSubscription = $("#subscriptionidfilter").val();
-            selectedLibrary      = $("#libraryfilter").val();
+            selectedLibrary = $("#libraryfilter").val();
 
             if (selectedSubscription == "all") {
-            clearFilters(true);
-            filterByLibrary();
+                clearFilters(true);
+                filterByLibrary();
             } else {
+                // We hide everything
+                $("table.subscriptionstclass tbody tr").hide();
 
-            // We hide everything
-            $("table.subscriptionstclass tbody tr").hide();
+                // Then show the lines that match the currently selected library
+                $("table.subscriptionstclass tbody tr td.libraryfilterclass:contains(" + selectedLibrary + ")")
+                    .parent()
+                    .show();
 
-            // Then show the lines that match the currently selected library
-            $("table.subscriptionstclass tbody tr td.libraryfilterclass:contains(" + selectedLibrary + ")").parent().show();
-
-            // Then hide the lines where the subscription id does not match the selected one
-            $("table.subscriptionstclass tbody tr td.subscriptionidfilterclass").not(
-                $("table.subscriptionstclass tbody tr td.subscriptionidfilterclass:contains(" + selectedSubscription + ")")
-            ).parent().hide();
+                // Then hide the lines where the subscription id does not match the selected one
+                $("table.subscriptionstclass tbody tr td.subscriptionidfilterclass")
+                    .not($("table.subscriptionstclass tbody tr td.subscriptionidfilterclass:contains(" + selectedSubscription + ")"))
+                    .parent()
+                    .hide();
             }
         }
 
@@ -308,23 +311,23 @@
 
             // Remove old subscription options
             $("#subscriptionidfilter option").remove();
-            $("#subscriptionidfilter option").append('<option value="all">'+_("(All)")+'</option>');
+            $("#subscriptionidfilter option").append('<option value="all">' + _("(All)") + "</option>");
             $("#subscriptionidfilter").attr("disabled", "disabled");
 
             if (keeplibrary != true) {
-            // Reinit library options
-            initFilters();
-            $("#libraryfilter option[value=all]").attr("selected", "selected");
+                // Reinit library options
+                initFilters();
+                $("#libraryfilter option[value=all]").attr("selected", "selected");
             }
         }
 
-        function showlayer(numlayer){
-            $(".yeardata").each(function(){
+        function showlayer(numlayer) {
+            $(".yeardata").each(function () {
                 ong = $(this).attr("id");
-                if(ong == "show"+numlayer){
+                if (ong == "show" + numlayer) {
                     $(this).show();
                     currentYear = ong;
-                } else  {
+                } else {
                     $(this).hide();
                 }
             });
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-illrequests.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-illrequests.tt
index 6ac225c643..254eaa4813 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-illrequests.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-illrequests.tt
@@ -422,102 +422,99 @@
             var metadata = "[% metadata | $raw %]";
         [% END %]
     </script>
-
     <script>
         function display_extended_attribute(row, type) {
-            var arr = $.grep(row.extended_attributes, ( x => x.type === type ));
+            var arr = $.grep(row.extended_attributes, x => x.type === type);
             if (arr.length > 0) {
                 return escape_str(arr[0].value);
             }
 
-            return '';
+            return "";
         }
 
         function display_request_status(row) {
-            let status       = row._strings.status.str;
-            let status_alias = row._strings.status_av ?
-                                    row._strings.status_av.str ?
-                                        row._strings.status_av.str :
-                                    row._strings.status_av.code :
-                               null;
+            let status = row._strings.status.str;
+            let status_alias = row._strings.status_av ? (row._strings.status_av.str ? row._strings.status_av.str : row._strings.status_av.code) : null;
 
-            let status_label = status + (status_alias ? " <i><strong>"+status_alias+"</strong></i>" : "");
+            let status_label = status + (status_alias ? " <i><strong>" + status_alias + "</strong></i>" : "");
 
             return status_label;
         }
         $("#illrequestlist").kohaTable({
-            order: [[ 0, "desc" ]],
+            order: [[0, "desc"]],
             dom: '<"dt-info"i><"top pager"<"table_entries"lp>t<"bottom pager"pi>',
             paging: true,
-            embed: ['+strings','extended_attributes'],
+            embed: ["+strings", "extended_attributes"],
             ajax: { url: `/api/v1/public/patrons/${logged_in_user_borrowernumber}/ill/requests` },
-            columnDefs: [ {
-                render: function (data, type, row, meta) {
-                    if ( data && type == 'display' ) {
-                        return data.escapeHtml();
-                    }
-                    return data;
-                }
-            } ],
+            columnDefs: [
+                {
+                    render: function (data, type, row, meta) {
+                        if (data && type == "display") {
+                            return data.escapeHtml();
+                        }
+                        return data;
+                    },
+                },
+            ],
             columns: [
                 {
-                    data: 'ill_request_id',
-                    sortable: true
+                    data: "ill_request_id",
+                    sortable: true,
                 },
                 {
-                    data: 'author',
+                    data: "author",
                     sortable: false,
                     render: (data, type, row, meta) => {
-                        return display_extended_attribute(row, 'author');
+                        return display_extended_attribute(row, "author");
                     },
                 },
                 {
-                    data: 'title',
+                    data: "title",
                     sortable: false,
                     render: (data, type, row, meta) => {
-                        return display_extended_attribute(row, 'title');
+                        return display_extended_attribute(row, "title");
                     },
                 },
                 {
-                    data: 'ill_backend_id',
-                    sortable: true
+                    data: "ill_backend_id",
+                    sortable: true,
                 },
                 {
-                    data: 'type',
+                    data: "type",
                     sortable: false,
                     render: (data, type, row, meta) => {
-                        return display_extended_attribute(row, 'type');
+                        return display_extended_attribute(row, "type");
                     },
                 },
                 {
-                    data: 'status',
+                    data: "status",
                     sortable: true,
                     render: (data, type, row, meta) => {
                         return display_request_status(row);
                     },
                 },
                 {
-                    data: 'requested_date',
+                    data: "requested_date",
                     sortable: true,
                     render: (data, type, row, meta) => {
                         return $date(data);
                     },
                 },
                 {
-                    data: 'timestamp',
+                    data: "timestamp",
                     sortable: true,
                     render: (data, type, row, meta) => {
                         return $date(data);
                     },
                 },
                 {
-                    data: '',
+                    data: "",
                     sortable: false,
                     render: (data, type, row, meta) => {
                         return `<a href="/cgi-bin/koha/opac-illrequests.pl?op=view&amp;illrequest_id=${row.ill_request_id}" class="btn btn-primary btn-sm">View</a>`;
                     },
-                }
-            ]
+                },
+            ],
         });
         $("#backend-dropdown-options").removeClass("nojs");
     </script>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt
index 60beacf6a1..f4546ddc83 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt
@@ -368,56 +368,58 @@
             OPACTableColExpandedByDefault: [% Koha.Preference('OPACTableColExpandedByDefault') ? 1 : 0 | html %],
         });
     </script>
-
     <script>
-        $(document).ready(function(){
-            function toggle_digest(id){
-                let phone_checked = prefs.TalkingTechItivaPhoneNotification ? false : prefs.PhoneNotification ? $("#phone"+id).prop("checked") : false;
+        $(document).ready(function () {
+            function toggle_digest(id) {
+                let phone_checked = prefs.TalkingTechItivaPhoneNotification ? false : prefs.PhoneNotification ? $("#phone" + id).prop("checked") : false;
 
-                if ( $("#email"+id).prop("checked") || $("#sms"+id).prop("checked") || phone_checked ) {
-                    $("#digest"+id).attr("disabled", false).tooltip('disable');
+                if ($("#email" + id).prop("checked") || $("#sms" + id).prop("checked") || phone_checked) {
+                    $("#digest" + id)
+                        .attr("disabled", false)
+                        .tooltip("disable");
                 } else {
-                    $("#digest"+id).attr("disabled", true).prop("checked",false).tooltip('enable');
+                    $("#digest" + id)
+                        .attr("disabled", true)
+                        .prop("checked", false)
+                        .tooltip("enable");
                 }
-
             }
             // At load time, we want digest disabled if no digest using transport is enabled
-            $(".pmp_email").each(function(){
+            $(".pmp_email").each(function () {
                 toggle_digest(Number($(this).attr("id").replace("email", "")));
             });
 
             // If user clears all digest using transports for a notice, disable digest checkbox
-            $(".pmp_email").click(function(){
+            $(".pmp_email").click(function () {
                 toggle_digest(Number($(this).attr("id").replace("email", "")));
             });
-            $(".pmp_sms").click(function(){
+            $(".pmp_sms").click(function () {
                 toggle_digest(Number($(this).attr("id").replace("sms", "")));
             });
-            $(".pmp_phone").click(function(){
+            $(".pmp_phone").click(function () {
                 toggle_digest(Number($(this).attr("id").replace("phone", "")));
             });
-
         });
 
-        function normalizeSMS(value){
-            let has_plus = value.charAt(0) === '+';
-            let new_value = value.replace(/\D/g,'');
-            if ( has_plus ) new_value = '+' + new_value;
+        function normalizeSMS(value) {
+            let has_plus = value.charAt(0) === "+";
+            let new_value = value.replace(/\D/g, "");
+            if (has_plus) new_value = "+" + new_value;
             return new_value;
         }
 
-        var sms_input = document.getElementById('SMSnumber');
+        var sms_input = document.getElementById("SMSnumber");
 
-        if (typeof sms_input !== 'undefined' && sms_input !== null) {
-            sms_input.addEventListener('keyup', function(){
+        if (typeof sms_input !== "undefined" && sms_input !== null) {
+            sms_input.addEventListener("keyup", function () {
                 var field = sms_input.value;
                 sms_input.value = normalizeSMS(field);
             });
 
-            sms_input.addEventListener('paste', function(event) {
-                let paste = (event.clipboardData || window.clipboardData).getData('text');
+            sms_input.addEventListener("paste", function (event) {
+                let paste = (event.clipboardData || window.clipboardData).getData("text");
                 setTimeout(function () {
-                sms_input.value = normalizeSMS(paste);
+                    sms_input.value = normalizeSMS(paste);
                 }, 100);
             });
         }
@@ -431,7 +433,7 @@
                 details: {
                     display: responsive_display,
                     type: "column",
-                    target: -1
+                    target: -1,
                 },
             },
             columnDefs: [{ className: "dtr-control", orderable: false, targets: -1 }],
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt
index 7e26c9d5cb..42a1c9f1d5 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-readingrecord.tt
@@ -234,46 +234,43 @@
             OPACTableColExpandedByDefault: [% Koha.Preference('OPACTableColExpandedByDefault') ? 1 : 0 | html %],
         });
     </script>
-
     <script>
-        $(document).ready(function(){
-            if ( prefs.GoogleJackets ){
+        $(document).ready(function () {
+            if (prefs.GoogleJackets) {
                 KOHA.Google.GetCoverFromIsbn();
             }
-            $('#order').change(function() {
-                $('#sortform').submit();
+            $("#order").change(function () {
+                $("#sortform").submit();
             });
 
             var responsive_display = prefs.OPACTableColExpandedByDefault ? DataTable.Responsive.display.childRowImmediate : DataTable.Responsive.display.childRow;
-            var table = $("#readingrec").kohaTable(
-                {
-                    dom: '<"top"<"table_entries"i><"table_controls"fB>>t',
-                    language: {
-                        search: "_INPUT_",
-                        searchPlaceholder: _("Search"),
-                    },
-                    responsive: {
-                        details: {
-                            display: responsive_display,
-                            type: "column",
-                            target: -1
-                        },
-                    },
-                    columnDefs: [
-                        { className: "dtr-control", orderable: false, targets: [-1] },
-                        { visible: false, targets: [0] },
-                    ],
+            var table = $("#readingrec").kohaTable({
+                dom: '<"top"<"table_entries"i><"table_controls"fB>>t',
+                language: {
+                    search: "_INPUT_",
+                    searchPlaceholder: _("Search"),
                 },
-            );
+                responsive: {
+                    details: {
+                        display: responsive_display,
+                        type: "column",
+                        target: -1,
+                    },
+                },
+                columnDefs: [
+                    { className: "dtr-control", orderable: false, targets: [-1] },
+                    { visible: false, targets: [0] },
+                ],
+            });
 
             let table_dt = table.DataTable();
 
             $("#tabs a[data-bs-toggle='tab']").on("shown.bs.tab", function (e) {
                 var id = e.target.id;
                 let pattern = "";
-                if ( id == "checkout-tab" ) {
+                if (id == "checkout-tab") {
                     pattern = "standard_checkout";
-                } else if ( id == "onsite_checkout-tab" ) {
+                } else if (id == "onsite_checkout-tab") {
                     pattern = "onsite_checkout";
                 }
                 table_dt.columns(0).search(pattern).draw();
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt
index cb680ca753..6497856eaa 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-suggestions.tt
@@ -579,18 +579,17 @@
     <script>
         const loggedinusername = [% ( loggedinusername ) ? 1 : 0 | html %];
     </script>
-
     [% IF ( loggedinusername ) %]
         <script>
-            function enableCheckboxActions(){
+            function enableCheckboxActions() {
                 // Enable/disable controls if checkboxes are checked
                 var checkedBoxes = $(".cb:checked");
                 if ($(checkedBoxes).size()) {
-                  $(".selections").html(_("With selected suggestions: "));
-                  $(".selections-toolbar .links a").removeClass("disabled");
+                    $(".selections").html(_("With selected suggestions: "));
+                    $(".selections-toolbar .links a").removeClass("disabled");
                 } else {
-                  $(".selections").html(_("Select suggestions to: "));
-                  $(".selections-toolbar .links a").addClass("disabled");
+                    $(".selections").html(_("Select suggestions to: "));
+                    $(".selections-toolbar .links a").addClass("disabled");
                 }
             }
         </script>
@@ -598,92 +597,89 @@
 
     [% IF Koha.Preference( 'OPACSuggestionAutoFill' ) %]
         <script>
-        $(function() {
-            $('#isbn').autofill({
-                'volumeInfo.title': {target: 'title', effect: 'flash'},
-                'volumeInfo.authors': {target: 'author', effect: 'flash'},
-                'volumeInfo.publisher': {target: 'publishercode', effect: 'flash'},
-                'volumeInfo.publishedDate': {target: 'copyrightdate', effect: 'flash'},
-                /* google books api seem to only have books, so if we got a result
-                 * item, type will be a book, so set to BK (book). */
-                'kind': {target: 'itemtype', handle: function(t,v) { t.val('BK'); },},
+            $(function () {
+                $("#isbn").autofill({
+                    "volumeInfo.title": { target: "title", effect: "flash" },
+                    "volumeInfo.authors": { target: "author", effect: "flash" },
+                    "volumeInfo.publisher": { target: "publishercode", effect: "flash" },
+                    "volumeInfo.publishedDate": { target: "copyrightdate", effect: "flash" },
+                    /* google books api seem to only have books, so if we got a result
+                     * item, type will be a book, so set to BK (book). */
+                    kind: {
+                        target: "itemtype",
+                        handle: function (t, v) {
+                            t.val("BK");
+                        },
+                    },
+                });
             });
-        });
         </script>
     [% END %]
-
     <script>
-        $(function() {
+        $(function () {
             $("#suggestt").kohaTable({
-                order: [[ 1, "asc" ]],
-                columnDefs: [
-                    ...( loggedinusername
-                        ? [{ targets: [ 0 ], orderable: false, searchable: false }]
-                        : []
-                    ),
-                    { className: 'dtr-control', orderable: false, targets: -1 },
-                    { responsivePriority: 1, targets: 1 }
-                ],
+                order: [[1, "asc"]],
+                columnDefs: [...(loggedinusername ? [{ targets: [0], orderable: false, searchable: false }] : []), { className: "dtr-control", orderable: false, targets: -1 }, { responsivePriority: 1, targets: 1 }],
                 responsive: {
                     details: {
-                        type: 'column',
-                        target: -1
-                    }
+                        type: "column",
+                        target: -1,
+                    },
                 },
             });
-            if (loggedinusername){
-            $("span.clearall").html("<a id=\"CheckNone\" class=\"btn btn-link btn-sm\" href=\"#\">"+_("Clear all")+"<\/a>");
-            $("span.checkall").html("<a id=\"CheckAll\" class=\"btn btn-link btn-sm\" href=\"#\">"+_("Select all")+"<\/a>");
-            $("#CheckAll").on("click",function(e){
-                e.preventDefault();
-                $(".cb").prop("checked", true);
-                enableCheckboxActions();
-            });
-            $("#CheckNone").on("click",function(e){
-                e.preventDefault();
-                $(".cb").prop("checked", false);
-                enableCheckboxActions();
-            });
-            $(".cb").click(function(){
-              enableCheckboxActions();
-            });
+            if (loggedinusername) {
+                $("span.clearall").html('<a id="CheckNone" class="btn btn-link btn-sm" href="#">' + _("Clear all") + "<\/a>");
+                $("span.checkall").html('<a id="CheckAll" class="btn btn-link btn-sm" href="#">' + _("Select all") + "<\/a>");
+                $("#CheckAll").on("click", function (e) {
+                    e.preventDefault();
+                    $(".cb").prop("checked", true);
+                    enableCheckboxActions();
+                });
+                $("#CheckNone").on("click", function (e) {
+                    e.preventDefault();
+                    $(".cb").prop("checked", false);
+                    enableCheckboxActions();
+                });
+                $(".cb").click(function () {
+                    enableCheckboxActions();
+                });
 
-            enableCheckboxActions();
+                enableCheckboxActions();
 
-            $(".removeitems").on("click", function(e) {
-                e.preventDefault();
-                var selected_titles = $("input:checked");
-                var title;
-                var yes_label;
-                var no_label;
-                var message = "";
-                if ( selected_titles.size() < 1 ) {
-                    alert( _("No suggestion was selected") );
-                    return false;
-                } else {
-                    if( selected_titles.size() > 1 ){
-                        message = $("<ul></ul>");
-                        title = _("Are you sure you want to delete these suggestions?");
-                        yes_label = _("Yes, delete suggestions");
-                        no_label = _("No, do not delete suggestions");
-                        selected_titles.each(function(){
-                            message.append( "<li>" +  $(this).data("title") + "</li>" );
-                        });
+                $(".removeitems").on("click", function (e) {
+                    e.preventDefault();
+                    var selected_titles = $("input:checked");
+                    var title;
+                    var yes_label;
+                    var no_label;
+                    var message = "";
+                    if (selected_titles.size() < 1) {
+                        alert(_("No suggestion was selected"));
+                        return false;
                     } else {
-                        title = _("Are you sure you want to delete this suggestion?");
-                        yes_label = _("Yes, delete suggestion");
-                        no_label = _("No, do not delete suggestion");
-                        selected_titles.each(function(){
-                            message += $(this).data("title");
+                        if (selected_titles.size() > 1) {
+                            message = $("<ul></ul>");
+                            title = _("Are you sure you want to delete these suggestions?");
+                            yes_label = _("Yes, delete suggestions");
+                            no_label = _("No, do not delete suggestions");
+                            selected_titles.each(function () {
+                                message.append("<li>" + $(this).data("title") + "</li>");
+                            });
+                        } else {
+                            title = _("Are you sure you want to delete this suggestion?");
+                            yes_label = _("Yes, delete suggestion");
+                            no_label = _("No, do not delete suggestion");
+                            selected_titles.each(function () {
+                                message += $(this).data("title");
+                            });
+                        }
+                        confirmModal(message, title, yes_label, no_label, function (result) {
+                            if (result) {
+                                $("#delete_suggestions").submit();
+                            }
                         });
                     }
-                    confirmModal( message, title, yes_label, no_label, function( result ){
-                        if( result ){
-                            $("#delete_suggestions").submit();
-                        }
-                    });
-                }
-            });
+                });
             }
         });
     </script>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
index 9a886a5d19..e2f8948422 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
@@ -1070,179 +1070,180 @@
         const is_debarred = [% userdebarred ? 1 : 0 | html %];
         const current_article_requests_size = [% current_article_requests.size || 0 | html %];
     </script>
-
     <script>
         var AR_CAPTION_COUNT = _("(%s total)");
 
-
-        function tableInit( tableId ){
-            if( tableId == "checkoutst" ){
-                $(".dt-buttons").append("<button type=\"button\" class=\"dt-button buttons-ical\" id=\"buttons-ics\">iCal</button> ");
-                if (prefs.OpacRenewalAllowed && can_renew && !is_debarred){
-                    $(".dt-buttons").append("<button id=\"renewselected_link\" class=\"dt-button buttons-renew\"><i class=\"fa fa-check\" aria-hidden=\"true\"></i> "+_("Renew selected")+"</button> <button id=\"renewall_link\" class=\"dt-button buttons-renewall\"><span class=\"fa-stack\"><i class=\"fa fa-check fa-stack-1x\" aria-hidden=\"true\"></i><i class=\"fa fa-check fa-stack-1x\" aria-hidden=\"true\"></i></span> "+_("Renew all")+"</button>");
+        function tableInit(tableId) {
+            if (tableId == "checkoutst") {
+                $(".dt-buttons").append('<button type="button" class="dt-button buttons-ical" id="buttons-ics">iCal</button> ');
+                if (prefs.OpacRenewalAllowed && can_renew && !is_debarred) {
+                    $(".dt-buttons").append(
+                        '<button id="renewselected_link" class="dt-button buttons-renew"><i class="fa fa-check" aria-hidden="true"></i> ' +
+                            _("Renew selected") +
+                            '</button> <button id="renewall_link" class="dt-button buttons-renewall"><span class="fa-stack"><i class="fa fa-check fa-stack-1x" aria-hidden="true"></i><i class="fa fa-check fa-stack-1x" aria-hidden="true"></i></span> ' +
+                            _("Renew all") +
+                            "</button>"
+                    );
                 }
             }
         }
-        $(document).ready(function(){
-            if (tab){
+        $(document).ready(function () {
+            if (tab) {
                 $(`#opac-user-views a[href='#${tab}_panel']`).tab("show");
             }
-            if( $("#opac-user-views .tab-pane.active").length < 1 ){
+            if ($("#opac-user-views .tab-pane.active").length < 1) {
                 $("#opac-user-views a:first").tab("show");
             }
 
-            $('#article-requests-table caption .count').html(AR_CAPTION_COUNT.format(current_article_requests_size));
+            $("#article-requests-table caption .count").html(AR_CAPTION_COUNT.format(current_article_requests_size));
 
             $(".modal-nojs").addClass("modal").addClass("hide").removeClass("modal-nojs");
 
-            $(".btn-delete-hold").on("click", function(e){
+            $(".btn-delete-hold").on("click", function (e) {
                 e.preventDefault();
                 var hold_title = $(this).data("title");
                 var reserve_id = $(this).data("reserve_id");
-                confirmModal( hold_title, _("Are you sure you want to cancel this hold?"), _("Yes, cancel hold"), _("No, do not cancel hold"), function( result ){
-                        if( result ){
-                            $("#delete_hold_" + reserve_id ).submit();
-                        }
+                confirmModal(hold_title, _("Are you sure you want to cancel this hold?"), _("Yes, cancel hold"), _("No, do not cancel hold"), function (result) {
+                    if (result) {
+                        $("#delete_hold_" + reserve_id).submit();
                     }
-                );
+                });
             });
 
-            $(".btn-req-delete-hold").on("click", function(e){
+            $(".btn-req-delete-hold").on("click", function (e) {
                 e.preventDefault();
                 var hold_title = $(this).data("title");
                 var reserve_id = $(this).data("reserve_id");
-                confirmModal( hold_title, _("Are you sure you want to request cancelling this hold?"), _("Yes"), _("No"), function( result ){
-                        if( result ){
-                            $("#req_cancel_hold_" + reserve_id ).submit();
-                        }
+                confirmModal(hold_title, _("Are you sure you want to request cancelling this hold?"), _("Yes"), _("No"), function (result) {
+                    if (result) {
+                        $("#req_cancel_hold_" + reserve_id).submit();
                     }
-                );
+                });
             });
 
-            $("#article-requests-table").on("click", ".btn-delete-article-request", function(e){
+            $("#article-requests-table").on("click", ".btn-delete-article-request", function (e) {
                 e.preventDefault();
                 var article_request = $(this).data("title");
                 var article_request_id = $(this).data("article-request_id");
-                (function(row){
-                    var doCancel = function( result ){
-                        if( result ){
+                (function (row) {
+                    var doCancel = function (result) {
+                        if (result) {
                             $.ajax({
                                 type: "DELETE",
                                 url: `/api/v1/public/patrons/${logged_in_user_borrowernumber}/article_requests/${article_request_id}?cancellation_reason=OPAC`,
-                                success: function( data ) {
-                                    $("#article_" + article_request_id ).hide({
-                                        duration: 'slow',
-                                        complete: function() {
+                                success: function (data) {
+                                    $("#article_" + article_request_id).hide({
+                                        duration: "slow",
+                                        complete: function () {
                                             $(this).siblings(".child").hide();
                                             var ar_tab = $('a[href="#opac-user-article-requests_panel"');
-                                            var ar_table = $('#article-requests-table');
-                                            var ar_length = $('tbody tr:visible', ar_table).length;
-                                            var ar_count = $('caption .count', ar_table);
+                                            var ar_table = $("#article-requests-table");
+                                            var ar_length = $("tbody tr:visible", ar_table).length;
+                                            var ar_count = $("caption .count", ar_table);
 
-                                            ar_tab.html(ar_tab.html().replace(/\(\d+\)/, '('+ar_length+')'));
+                                            ar_tab.html(ar_tab.html().replace(/\(\d+\)/, "(" + ar_length + ")"));
                                             ar_count.html(AR_CAPTION_COUNT.format(ar_length));
-
-                                        }
+                                        },
                                     });
-                                }
+                                },
                             });
                         }
                     };
-                    confirmModal( article_request, _("Are you sure you want to cancel this article request?"), _("Yes, cancel article request"), _("No, do not cancel article request"), doCancel);
-                })($(this))
+                    confirmModal(article_request, _("Are you sure you want to cancel this article request?"), _("Yes, cancel article request"), _("No, do not cancel article request"), doCancel);
+                })($(this));
             });
 
             /* We initiate this flatpickr instance here so that we can use the variable later */
             var suspend_until_date = $("#suspend_untilDate").flatpickr({
-                minDate: "today"
+                minDate: "today",
             });
 
-            $(document).on("click", ".suspend_hold", function(e){
+            $(document).on("click", ".suspend_hold", function (e) {
                 e.preventDefault();
                 var title = $(this).data("title");
                 var reserve_id = $(this).data("reserve_id");
-                $("#suspendHoldReserveId").val( reserve_id );
-                $("#suspendHoldTitle").html( "<em>" + title + "</em>" );
+                $("#suspendHoldReserveId").val(reserve_id);
+                $("#suspendHoldTitle").html("<em>" + title + "</em>");
                 $("#suspendHoldModal").modal("show");
             });
 
-            $("#suspendHoldModal").on("hidden.bs.modal", function(){
+            $("#suspendHoldModal").on("hidden.bs.modal", function () {
                 $("#suspendHoldTitle").html("");
                 $("#suspendHoldReserveId").val("");
                 suspend_until_date.clear();
             });
 
-            $("#suspend_all_submit").on("click", function(e){
+            $("#suspend_all_submit").on("click", function (e) {
                 e.preventDefault();
                 var title = _("Are you sure you want to suspend all holds?");
                 var body = _("All holds will be suspended.");
-                confirmModal( body, title, _("Yes, suspend all holds"), "", function( result ){
-                        if( result ){
-                            $("#suspend_all_holds").submit();
-                        }
+                confirmModal(body, title, _("Yes, suspend all holds"), "", function (result) {
+                    if (result) {
+                        $("#suspend_all_holds").submit();
                     }
-                );
+                });
             });
 
-            $("#resume_all_submit").on("click", function(e){
+            $("#resume_all_submit").on("click", function (e) {
                 e.preventDefault();
                 var title = _("Are you sure you want to resume all suspended holds?");
                 var body = _("All holds will resume.");
-                confirmModal( body, title, _("Yes, resume all holds"), _("No, do not resume holds"), function( result ){
-                        if( result ){
-                            $("#resume_all_holds").submit();
-                        }
+                confirmModal(body, title, _("Yes, resume all holds"), _("No, do not resume holds"), function (result) {
+                    if (result) {
+                        $("#resume_all_holds").submit();
                     }
-                );
+                });
             });
 
             var dTables = $("#checkoutst,#holdst,#overduest,#opac-user-relative-issues-table");
-            dTables.each(function(){
+            dTables.each(function () {
                 var thIndex = $(this).find("th.psort").index();
-                $(this).on("init.dt", function() {
-                        tableInit( $(this).attr("id") );
+                $(this)
+                    .on("init.dt", function () {
+                        tableInit($(this).attr("id"));
                     })
                     .kohaTable({
-                    order: [[ thIndex, 'asc' ]],
-                    dom: '<"top"<"table_entries"><"table_controls"fB>>t',
-                    columnDefs: [
-                        { visible: false, "targets" : [ "hidden" ] },
-                        { className: 'dtr-control', orderable: false, targets: -1 }
-                    ],
-                    language: {
-                        search: "_INPUT_",
-                        searchPlaceholder: _("Search")
-                    },
-                    responsive: {
-                        details: {
-                            type: 'column',
-                            target: -1
-                        }
-                    },
-                    buttons: [
-                        /* Override default button set so that we can extend the options of print and csv */
-                        'clearFilter', 'copy',
-                        {
-                            extend: "print",
-                            exportOptions: {
-                                /* Print view should show all columns (even invisible ones) unless they are .no-export */
-                                columns: ":not(.no-export)"
-                            }
+                        order: [[thIndex, "asc"]],
+                        dom: '<"top"<"table_entries"><"table_controls"fB>>t',
+                        columnDefs: [
+                            { visible: false, targets: ["hidden"] },
+                            { className: "dtr-control", orderable: false, targets: -1 },
+                        ],
+                        language: {
+                            search: "_INPUT_",
+                            searchPlaceholder: _("Search"),
                         },
-                        {
-                            extend: "csv",
-                            exportOptions: {
-                                /* CSV export should include all columns (even invisible ones) unless they are .no-export */
-                                columns: ":not(.no-export)"
-                            }
-                        }
-                    ]
-                });
+                        responsive: {
+                            details: {
+                                type: "column",
+                                target: -1,
+                            },
+                        },
+                        buttons: [
+                            /* Override default button set so that we can extend the options of print and csv */
+                            "clearFilter",
+                            "copy",
+                            {
+                                extend: "print",
+                                exportOptions: {
+                                    /* Print view should show all columns (even invisible ones) unless they are .no-export */
+                                    columns: ":not(.no-export)",
+                                },
+                            },
+                            {
+                                extend: "csv",
+                                exportOptions: {
+                                    /* CSV export should include all columns (even invisible ones) unless they are .no-export */
+                                    columns: ":not(.no-export)",
+                                },
+                            },
+                        ],
+                    });
             });
 
             var responsive_display = prefs.OPACTableColExpandedByDefault ? DataTable.Responsive.display.childRowImmediate : DataTable.Responsive.display.childRow;
             var dataTables = $("#recalls-table,#article-requests-table");
-            dataTables.each(function(){
+            dataTables.each(function () {
                 $(this).kohaTable({
                     searching: false,
                     paging: false,
@@ -1251,69 +1252,65 @@
                         details: {
                             display: responsive_display,
                             type: "column",
-                            target: -1
+                            target: -1,
                         },
                     },
                     columnDefs: [{ className: "dtr-control", orderable: false, targets: -1 }],
                 });
             });
-            $('a[data-bs-toggle="tab"]').on('shown.bs.tab', function (event) {
+            $('a[data-bs-toggle="tab"]').on("shown.bs.tab", function (event) {
                 dTables.DataTable().responsive.recalc();
                 dataTables.DataTable().responsive.recalc();
-            } );
-
-            $("body").on("click", "#buttons-ics", function(){
-                location.href="/cgi-bin/koha/opac-ics.pl";
             });
 
-            if (prefs.GoogleJackets){
+            $("body").on("click", "#buttons-ics", function () {
+                location.href = "/cgi-bin/koha/opac-ics.pl";
+            });
+
+            if (prefs.GoogleJackets) {
                 KOHA.Google.GetCoverFromIsbn();
             }
-            if (prefs.OpacRenewalAllowed && can_renew && !is_debarred){
-                $("#renewselected").submit(function(){
+            if (prefs.OpacRenewalAllowed && can_renew && !is_debarred) {
+                $("#renewselected").submit(function () {
                     valid = false;
-                    $("input[type=checkbox]").each(function(){
-                        if($(this).is(':checked')){
+                    $("input[type=checkbox]").each(function () {
+                        if ($(this).is(":checked")) {
                             valid = true;
                         }
                     });
-                    if(!valid){
+                    if (!valid) {
                         alert(_("Nothing has been selected. Check the box for each item you want to renew"));
                     }
                     return valid;
                 });
-                $("body").on("click","#renewselected_link",function(e){
+                $("body").on("click", "#renewselected_link", function (e) {
                     e.preventDefault();
                     $("#renewselected").submit();
                 });
-                $("body").on("click","#renewall_link, #renewall_js",function(e){
+                $("body").on("click", "#renewall_link, #renewall_js", function (e) {
                     e.preventDefault();
                     $("#renewall").submit();
                 });
             }
 
-            if (prefs.AllowCheckoutNotes){
-
+            if (prefs.AllowCheckoutNotes) {
                 /* If JS enabled, show button, otherwise show link to redirect to a page where note can be submitted */
                 $(".nonjs_submitnote").hide();
 
-                $("input[name='note']").prop('readonly', false);
-                $("input[name='note']").keypress(function(e){
+                $("input[name='note']").prop("readonly", false);
+                $("input[name='note']").keypress(function (e) {
                     /* prevent submitting of renewselected form */
-                    if(e.which == 13)
-                        e.preventDefault();
+                    if (e.which == 13) e.preventDefault();
                 });
 
-                $("input[name='note']").keyup(function(e){
-                    var $btn_save = $('#save_'+$(this).data('issue_id'));
-                    var origvalue = $(this).data('origvalue');
+                $("input[name='note']").keyup(function (e) {
+                    var $btn_save = $("#save_" + $(this).data("issue_id"));
+                    var origvalue = $(this).data("origvalue");
                     var value = $(this).val();
 
-                    if(origvalue != value) {
-                        if(origvalue != "")
-                            $btn_save.text(_("Submit changes"));
-                        else
-                            $btn_save.text(_("Submit note"));
+                    if (origvalue != value) {
+                        if (origvalue != "") $btn_save.text(_("Submit changes"));
+                        else $btn_save.text(_("Submit note"));
                         $btn_save.show();
                     } else {
                         $btn_save.hide();
@@ -1321,120 +1318,125 @@
                 });
             }
 
-            $(".change_pickup").on("click", function(){
+            $(".change_pickup").on("click", function () {
                 var hold_id = $(this).data("hold-id");
                 $(this).hide();
-                $("#change-pickup-location" + hold_id ).show();
+                $("#change-pickup-location" + hold_id).show();
             });
 
-            if ( $('#opac-user-clubs_panel').length ) {
-                $('#opac-user-clubs-tab').on('click', function() {
-                    $('#opac-user-clubs_panel').text(_("Loading..."));
-                    $('#opac-user-clubs_panel').load(`/cgi-bin/koha/clubs/clubs-tab.pl?borrowernumber=${logged_in_user_borrowernumber}`);
+            if ($("#opac-user-clubs_panel").length) {
+                $("#opac-user-clubs-tab").on("click", function () {
+                    $("#opac-user-clubs_panel").text(_("Loading..."));
+                    $("#opac-user-clubs_panel").load(`/cgi-bin/koha/clubs/clubs-tab.pl?borrowernumber=${logged_in_user_borrowernumber}`);
                 });
             }
 
-            $(".cancel_recall").click(function(e){
+            $(".cancel_recall").click(function (e) {
                 return confirmDelete(_("Are you sure you want to remove this recall?"));
             });
 
-            $("body").on("click", ".btn-add-note", function(e){
+            $("body").on("click", ".btn-add-note", function (e) {
                 e.preventDefault();
                 var title = $(this).data("title");
                 var issue_id = $(this).data("issueid");
-                var note = $("#note_" + issue_id ).val();
-                var origvalue = $("#note_" + issue_id ).data("origvalue");
-                $("#addNote").val( note );
-                $("#addNoteIssueId").val( issue_id );
-                $("#addNoteTitle").text( title );
+                var note = $("#note_" + issue_id).val();
+                var origvalue = $("#note_" + issue_id).data("origvalue");
+                $("#addNote").val(note);
+                $("#addNoteIssueId").val(issue_id);
+                $("#addNoteTitle").text(title);
                 $("#addNoteModal").modal("show");
             });
 
-            $("#addNoteForm").on("submit", function(e){
+            $("#addNoteForm").on("submit", function (e) {
                 e.preventDefault();
                 var title = $("#addNoteTitle").text();
                 var issue_id = $("#addNoteIssueId").val();
                 var note = $("#addNote").val();
-                submitNote( title, issue_id, note );
+                submitNote(title, issue_id, note);
             });
 
-            $("#addNoteModal").on("hidden.bs.modal", function(){
+            $("#addNoteModal").on("hidden.bs.modal", function () {
                 $("#addNoteTitle").text("");
                 $("#addNote").val("");
             });
 
-            $(".dismiss-message-button").click(function(e){
+            $(".dismiss-message-button").click(function (e) {
                 return confirmDelete(_("Are you sure you want to dismiss this message?"));
             });
-
         });
 
-        function submitNote( title, issue_id, note ){
+        function submitNote(title, issue_id, note) {
             var self = $("#addNoteModal");
-            var notebutton = $("#save_" + issue_id );
-            var noteinput = $("#note_" + issue_id );
+            var notebutton = $("#save_" + issue_id);
+            var noteinput = $("#note_" + issue_id);
 
             var ajaxData = {
-                'action': 'issuenote',
-                'issue_id': issue_id,
-                'note': note,
-                csrf_token: $('meta[name="csrf-token"]').attr('content'),
-                op: 'cud-add_note',
+                action: "issuenote",
+                issue_id: issue_id,
+                note: note,
+                csrf_token: $('meta[name="csrf-token"]').attr("content"),
+                op: "cud-add_note",
             };
 
             $.ajax({
-                url: '/cgi-bin/koha/svc/checkout_notes/',
-                type: 'POST',
-                dataType: 'json',
+                url: "/cgi-bin/koha/svc/checkout_notes/",
+                type: "POST",
+                dataType: "json",
                 data: ajaxData,
             })
-            .done(function(data) {
-                var message = "";
-                if(data.status == 'saved') {
-                    $("#notesaved").removeClass("alert-error");
-                    $("#notesaved").addClass("alert-info");
-                    noteinput.data('origvalue', data.note)
-                        .val(data.note);
-                    notebutton.text( _("Edit note" ) );
-                    $("#viewnote_" + issue_id ).text( data.note );
-                    message = "<p>" + _("Your note about %s has been saved and sent to the library.").format( em(title) ) + "</p>";
-                    message += "<p class=\"checkout_note\">" + data.note;
-                    message += "<a href=\"/cgi-bin/koha/opac-issue-note.pl?issue_id=" + issue_id + "\" class=\"btn btn-link btn-sm btn-add-note\" data-title=\"" + title + "\" data-issueid=\"" + issue_id + "\"><i class=\"fa fa-pencil\" aria-hidden=\"true\"></i> " + _("Edit note") + "</a>";
-                    message += "</p>";
-                } else if(data.status == 'removed') {
-                    $("#notesaved").removeClass("alert-error");
-                    $("#notesaved").addClass("alert-info");
-                    noteinput.data('origvalue', "")
-                        .val("")
-                    notebutton.text( _("Add note") );
-                    $("#viewnote_" + issue_id ).text( data.note );
-                    message = "<p>" + _("Your note about %s was removed.").format( em(title) ) + "</p>";
-                } else {
+                .done(function (data) {
+                    var message = "";
+                    if (data.status == "saved") {
+                        $("#notesaved").removeClass("alert-error");
+                        $("#notesaved").addClass("alert-info");
+                        noteinput.data("origvalue", data.note).val(data.note);
+                        notebutton.text(_("Edit note"));
+                        $("#viewnote_" + issue_id).text(data.note);
+                        message = "<p>" + _("Your note about %s has been saved and sent to the library.").format(em(title)) + "</p>";
+                        message += '<p class="checkout_note">' + data.note;
+                        message +=
+                            '<a href="/cgi-bin/koha/opac-issue-note.pl?issue_id=' +
+                            issue_id +
+                            '" class="btn btn-link btn-sm btn-add-note" data-title="' +
+                            title +
+                            '" data-issueid="' +
+                            issue_id +
+                            '"><i class="fa fa-pencil" aria-hidden="true"></i> ' +
+                            _("Edit note") +
+                            "</a>";
+                        message += "</p>";
+                    } else if (data.status == "removed") {
+                        $("#notesaved").removeClass("alert-error");
+                        $("#notesaved").addClass("alert-info");
+                        noteinput.data("origvalue", "").val("");
+                        notebutton.text(_("Add note"));
+                        $("#viewnote_" + issue_id).text(data.note);
+                        message = "<p>" + _("Your note about %s was removed.").format(em(title)) + "</p>";
+                    } else {
+                        $("#notesaved").removeClass("alert-info");
+                        $("#notesaved").addClass("alert-error");
+                        message = "<p>" + _("Your note about %s could not be saved.").format(em(title)) + "</p>";
+                        notebutton.text(_("Add note"));
+                        $("#viewnote_" + issue_id).text(data.note);
+                        message += '<p style="font-weight:bold;">' + _("Something went wrong. The note has not been saved") + "</p>";
+                    }
+                    $("#notesaved").html(message);
+                })
+                .fail(function (data) {
                     $("#notesaved").removeClass("alert-info");
                     $("#notesaved").addClass("alert-error");
-                    message =  "<p>" + _("Your note about %s could not be saved.").format( em(title) ) + "</p>";
-                    notebutton.text( _("Add note") );
-                    $("#viewnote_" + issue_id ).text( data.note );
-                    message += "<p style=\"font-weight:bold;\">" + _("Something went wrong. The note has not been saved") + "</p>";
-                }
-                $("#notesaved").html(message);
-            })
-            .fail(function(data) {
-                $("#notesaved").removeClass("alert-info");
-                $("#notesaved").addClass("alert-error");
-                var message = "<p style=\"font-weight:bold;\">" + _("Something went wrong. The note has not been saved") + "</p>";
-                $("#notesaved").html(message);
-            })
-            .always(function() {
-                self.modal("hide");
-                $("#notesaved").show();
-            });
+                    var message = '<p style="font-weight:bold;">' + _("Something went wrong. The note has not been saved") + "</p>";
+                    $("#notesaved").html(message);
+                })
+                .always(function () {
+                    self.modal("hide");
+                    $("#notesaved").show();
+                });
         }
 
-        function em( title ){
+        function em(title) {
             return "<em>" + title + "</em>";
         }
-
     </script>
     [% IF ( Koha.Preference('OpacStarRatings') == 'all' ) %]
         [% Asset.js("lib/jquery/plugins/jquery.barrating.min.js") | $raw %]