Question

我试图创建一个内部具有一些额外交互性的对话框;即从多选中添加/删除选项。基本代码如下：

的jQuery

$(document).ready(function() {
    $("#addCallDialogForm").dialog({
        autoOpen: false,
        model: true,
        width: 500,
        buttons: {
            "Add Call": function() {
                alert("Adding Call")

                $(this).dialog("close");
            },
            "Cancel": function() {
                $(this).dialog("close");
            }
        },

        open: function(event, ui) {
            //Doing additional Stuff Here
        },

        close: function(event, ui) {
            //Doing additional Stuff Here Too
        }
    });

    $("#addBtn").click(function() {
        alert("button Clicked");
    });
});

HTML

<div id="addCallDialogForm" title="Add Call">
    <form>
        <fieldset>
            <button id="addBtn">Add</button>
        </fieldset>
    </form>
</div>

问题是，当我点击“添加”按钮时，会显示警告，但是一旦我单击“确定”，对话框就会关闭。我尝试使用'beforeClose'方法指定对话框何时关闭，但这没有用。

任何人都可以提供帮助。提前谢谢。

Answer 1

经过一些研究后，我发现单击对话框中的任何按钮都会提交该表单。通过在所需方法中添加event.preventDefault()作为第一行，按钮可以完成我想要的操作而无需提交和关闭。

相关文章：Here

感谢您的尝试 - G

Answer 2

按钮标记：

<asp:Button ID="btnClose" runat="server" Text="Cancel" Style="margin-left: 12px;
    background-color: #FE8000; color: white" 
OnClientClick="closeCommentPopup()" />

closeCommentPopup函数：

<script type="text/javascript">
    function closeCommentPopup() {
        $('#dialog').dialog('close');
        return false;
    };
</script>

关闭Button Click的jQueryUI对话框

2 个答案: