How to use jquery.confirm plugin on dynamic content

Question

I've been looking at a few options for creating a confirm dialog for my web application, I decided to go with one that seemed to be good, which is jquery.confirm .

Its normal usage is:

$("selector").confirm({
    options / functions
});

My confirm dialog fires an ajax event and everything goes well, BUT, the ajax function changes the content of the page dynamically, and the confirm event does not work after the first ajax call.

Is there a way to call the confirm function from a

on("click", "selector", function(){

type of function?

I could copy my code, but it wouldn't matter very much, as the only thing I truly need is to fire this confirm plugin dialog from a dynamically generated element.

Thanks in advance for your help!

Answer 1

您可以尝试使用提供类似功能的JqueryUI。

Answer 2

Turns out you can do it this way:

$("#wrapper").on("click", ".removeNode", function () {

        $(this).confirm({

            confirm: function (button) {
                nodeTitle = button.parent().attr("id");
                if (nodeTitle) {
                    $.ajax({
                        url: "NodeManager/RemoveNode",
                        async: "true",
                        type: "GET",
                        data: { "title": nodeTitle },
                        success: function (result) {
                            $("#NodeViewer").html(result);
                        }
                    });
                }
            }
        });
    });

Only issue is, it requires 2 clicks to work, but it doesn't seem to be related to the "on" event.

Hope this helps someone else as well!