From 7002b057c19fec4f0c9bb556deab11cc3f35bd37 Mon Sep 17 00:00:00 2001 From: Tomas Cohen Arazi Date: Tue, 13 May 2025 09:42:57 -0300 Subject: [PATCH] Bug 32266: (follow-up) Add event listeners in correct context As the datatable is redrawn asynchronously and on each interaction, the initially defined event listeners have no effect. This yields a weird rendering of the attribute edit form in a new page. This patch makes the event listeners exist at the `$(#late_orders)` level so they still apply to newly created cells on redrawing the datatable. A couple places get 'modernized' by using the arrow syntax for anonymous functions. `e.target` is used instead of `$(this)` where it applies. To test: 1. Without the patch, have some late orders 2. Try changing the delivery date or any of the notes => FAIL: You are sent to a new page 3. Apply this patch and reload 4. Repeat 2 => SUCCESS: You are presented a nice modal instead (the original behavior) 5. Change the values, verify the table is re-rendered and the values are correct 6. Sign off :-D --- .../prog/en/modules/acqui/lateorders.tt | 33 +++++++++++-------- 1 file changed, 19 insertions(+), 14 deletions(-) diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt index 166a33ce711..d3d58438913 100644 --- a/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt +++ b/koha-tmpl/intranet-tmpl/prog/en/modules/acqui/lateorders.tt @@ -266,6 +266,7 @@ var table_settings = [% TablesSettings.GetTableSettings( 'acqui', 'lateorders', 'late_orders', 'json' ) | $raw %]; var late_orderst = $("#late_orders").kohaTable({ order: [[ 1, "asc" ]], + stateSave: true, paging: true, embed: [ "basket.authorizer+strings", @@ -506,7 +507,7 @@ $(".clear_search").click(clearFilters); // Generates a dynamic link for exporting the selection's data as CSV - $("#exportbutton, #export-csv-menu a").click(function() { + $("#exportbutton, #export-csv-menu a").on( "click", () => { var all_nodes = late_orderst.DataTable().rows().nodes(); var selected = $(all_nodes).find("input[name='ordernumber']:checked"); @@ -528,21 +529,23 @@ return false; }); - $(".edit_note").on("click", function(e) { + $("#late_orders").on("click", ".edit_note", (e) => { e.preventDefault(); - var ordernumber = $(this).data("ordernumber"); - var note_type = $(this).data("note_type"); - var modalTitle = _("%s (order number %s)").format($(this).attr("title"), ordernumber); - var note_text = $( "#" + note_type + "-note-" + ordernumber ).html(); + const target = e.target; + const ordernumber = $(target).data("ordernumber"); + const note_type = $(target).data("note_type"); + const modalTitle = _("%s (order number %s)").format($(target).attr("title"), ordernumber); + const note_text = $("#" + note_type + "-note-" + ordernumber).html(); + $("#noteEditor .modal-title").text(modalTitle); - $("#notes_ordernumber").val( ordernumber ); - $("#ordernotes").html( note_text ); - $("#type").val( note_type ); + $("#notes_ordernumber").val(ordernumber); + $("#ordernotes").html(note_text); + $("#type").val(note_type); $("#noteEditor").modal("show"); $("#ordernotes").focus(); }); - $("#noteEditor").on('hidden.bs.modal', function (e) { + $("#noteEditor").on('hidden.bs.modal', () => { $("#noteEditorLabel").html(""); $("#noteEditor .modal-title").text(""); $("#ordernotes").html( "" ); @@ -550,20 +553,22 @@ $("#type").val(""); }); - $(".edit_delivery_date").on("click", function(e) { + $("#late_orders").on("click", ".edit_delivery_date", (e) => { e.preventDefault(); - var ordernumber = $(this).data("ordernumber"); + const target = e.target; + var ordernumber = $(target).data("ordernumber"); var order_number_text = _("(order number %s)").format(ordernumber); - var modalTitle = $(this).attr("title") + " " + order_number_text; + var modalTitle = $(target).attr("title") + " " + order_number_text; var delivery_date = $( "#delivery_date_" + ordernumber ).data("delivery_date"); const estimated_delivery_date = document.querySelector("#estimated_delivery_date")._flatpickr; estimated_delivery_date.setDate( delivery_date ); + $("#dateEditor .modal-title").text(modalTitle); $("#date_ordernumber").val(ordernumber); $("#dateEditor").modal("show"); }); - $("#dateEditor").on('hidden.bs.modal', function (e) { + $("#dateEditor").on('hidden.bs.modal', () => { $("#dateEditorLabel").html(""); $("#dateEditor .modal-title").text(""); $("#estimated_delivery_date").html( "" ); -- 2.49.0