0

Since an upgrade in JQuery, I have problems catching an event on a new div added displaying a row of data.

Initially when my screen displays, I have one row of data displayed. When I click on a cell in this row, it triggers a "click" event associated with class "transferaction", and proceeds to create a second new row of data on screen that is a clone of the first. I can then click on the second row, and yet again trigger a "click" event to add yet another third row. Since an upgrade to JQuery, the new target row no triggers the click event (even thought it contains class "transferaction"). How can I change the NEW JQuery to pick up the click event from a NEW ROW?

OLD JQuery

    $(".transferaction").live("click", function (event) {
        top.copyRow(this, null, ['odd', 'even']);
    });

NEW JQuery

    $(".transferaction").on("click", function (event)
    {
        top.copyRow(this, null, ['odd', 'even']);
    });

NEW ROW

<select name="ddlTransferStatus" id="ddlTransferStatus" class="fac transferaction" objectname="TransferStatus" row_index="-1" row_id="-1" group_row_id="1"><option selected="selected" value=""></option><option value="REQUEST TRANSFER">REQUEST TRANSFER</option><option value="RECEIVE PARTS IN">RECEIVE PARTS IN</option><option value="CANCELED">CANCELED</option></select>
Phil
  • 141,914
  • 21
  • 225
  • 223
Mark Johnson
  • 73
  • 5
  • 1
    You need to move the delegated event target higher, ie a parent element where the `.transferaction` are its children... `$(document.body).on("click", ".transferaction", function (event) { ... })` – Phil May 13 '22 at 01:54

0 Answers0