0

I am generating rows dynamically for a table using ASP.NET Core Razor Pages and each row has a Delete button without button ID. example of generated HTML for a row:

<button onclick="return DeleteRowConfirm(event);" data-ajax="true" data-ajax-method="GET" data-ajax-begin="AjaxOnBegin" data-ajax-complete="AjaxOnComplete" data-ajax-failure="failed" data-ajax-update="#div_BusyIndicator" href="/ApproveNumber/a10b0c7a?handler=DeleteRow">Delete Row</button>

on button click I am using bootbox.js to confirm using this code:

function DeleteRowConfirm(e) {
        e.preventDefault();
        bootbox.confirm({
            message: "Delete Row?",
            buttons: {
                confirm: {
                    label: 'Yes',
                    className: 'btn-success'
                },
                cancel: {
                    label: 'No',
                    className: 'btn-danger'
                }
            },
            callback: function (result) {
                if (result === false) {
                
                }
                else {
                    
                  //$(this).trigger(e.type); //Doe not working
                   
                }

            }
        });
    }

I would like to execute the "Button Click" if the user press "Yes". I have tried $(this).trigger(e.type); but it does not working.

mkrieger1
  • 19,194
  • 5
  • 54
  • 65
AG70
  • 874
  • 1
  • 9
  • 23

1 Answers1

0

I solved the problem with the help of @mousetail and "Pooma" from this link https://stackoverflow.com/a/48018708

I have replaced button element to element and for onclick I have set event.preventDefault(); event.stopImmediatePropagation(); DeleteRowConfirm(event);

at DeleteRowConfirm function when callback is true I have removed the onclick from the element so it does not loop with bootbox popup and than trigger the click event.

$(e.target).removeAttr('onclick');
$(e.target).trigger(e.type);
AG70
  • 874
  • 1
  • 9
  • 23