区分2个jquery对话框

Question

我有一个jquery对话框，它为表添加一个名称，并在该名称旁边添加一个删除按钮。我试图添加删除该名称的功能，如果用户单击删除按钮。我似乎无法做到这一点，当用户点击删除按钮时，会调用deleteUser函数...当我点击删除按钮时没有任何反应。

    dialog = $("#add-dialog-form").dialog({
            autoOpen: false,
            height: 400,
            width: 350,
            modal: true,
            buttons: {
                "Add Ownertest": addUser,
                Cancel: function () {
                    dialog.dialog("close");
                }
            },
            close: function () {
                addform[0].reset();
                allFields.removeClass("ui-state-error");
            }
        });

    deleteDialog = $("#delete-dialog-form").dialog({
        autoOpen: false,
        height: 400,
        width: 350,
        modal: true,
        buttons: {
            "Delete Owner": deleteUser,
            Cancel: function () {
                dialog.dialog("close");
            }
        },
        close: function () {
            deleteform[0].reset();
            allFields.removeClass("ui-state-error");
        }
    });

这里调用这些对话框：

    addform = dialog.find("form#addUser").on("submit", function (event) {
        event.preventDefault();
        addUser();
    });

    deleteform = dialog.find("form#deleteUser").on("submit", function (event) {
        event.preventDefault();
        deleteUser();
    });

    $("#create-user").button().on("click", function () {
        dialog.dialog("open");
    });

    $("#delete-user").button().on("click", function () {
        deleteDialog.dialog("open");
    });

HTML如下：

<div id="add-dialog-form" title="Add Owner">
    <form id="addUser">
        <fieldset>
            <label for="owners">NameOne</label>
            <input type="text" name="owners" id="owners" value="" class="text ui-widget-content ui-corner-all">

            <!-- Allow form submission with keyboard without duplicating the dialog button -->
            <input type="submit" tabindex="-1" style="position:absolute; top:-1000px">
        </fieldset>
    </form>
</div>

<div id="delete-dialog-form" title="Add Owner">
    <form id="deleteUser">
        <fieldset>
            <label for="owners">NameTwo</label>
            <input type="text" name="owners" id="owners" value="" class="text ui-widget-content ui-corner-all">

            <!-- Allow form submission with keyboard without duplicating the dialog button -->
            <input type="submit" tabindex="-1" style="position:absolute; top:-1000px">
        </fieldset>
    </form>
</div>

addUser（）函数中添加表中删除按钮的部分：

        var tblRow = $("<tr>" +
         "<td>" + name.val() + "<button id='delete-user' style='float:right' title='Delete' class='btn btn-danger btn-xs actionbutton'><span class='glyphicon glyphicon-remove'></span></button>" + "</td>" +
         "</tr>");

        tblRow.find('button#create-user').button().on('click', function () {
            dialog.dialog("open"); // where dialog is instance of jq dialog, dialog = $( "#dialog-form" ).dialog({...})
        });