使用jquery在jquery ui对话框关闭函数上提交表单

时间:2013-03-10 16:54:30

标签: jquery asp.net-mvc jquery-ui

我的jquery ui对话框上有一个按钮,如下所示:

<div id="dialog-confirm" title="Multiple Account Login" style="display: none;">
     <a class="close-btn" href="#" id="A16">
                <img src="../../Content/NewDesign/images/cross.png" width="28" height="28" alt="close dialog" onclick="closeMultipleAccountDialog();" /></a>
            <div class="clear-n">
            </div>
</div>

单击此按钮会调用函数

    function closeMultipleAccountDialog() {
        $("#hdfAccount").val("cancel");
        $("#hdPage").val("151API");
        $("#hdID").val($("#ID").val());
        $("#hdPSSWD").val($("#PSSWD").val());
        $("#hdACCID").val($("#ACCID").val());
        $("#hdPASSWDINT").val($("#PASSWDINT").val());
        $("#frmsetAccount").submit();
        $(this).dialog("close");        
     }

此功能需要提交表格:

      <form action="../Account/SetAccount" method="post" id="frmsetAccount">
                            <div class="flds-up">
                                <div class="lft-txt">
                                    Account <span>:</span></div>
                                <div class="user-fld">
                                    <%=  ViewData["MyAccountsList"] %>
                                </div>
                                <div class="clear-n">
                                </div>
                                <input type="hidden" id="hdfAccount" name="hdfAccount" value="" />
                                <input type="hidden" id="hdPage" name="hdPage" value="" />
                                <input type="hidden" id="hdID" name="hdID" value="" />
                                <input type="hidden" id="hdPSSWD" name="hdPSSWD" value="" />
                                <input type="hidden" id="hdACCID" name="hdACCID" value="" />
                                <input type="hidden" id="hdPASSWDINT" name="hdPASSWDINT" value="" />
                            </form>

and dialog code is like this:

$("#dialog-confirm").dialog({
                autoOpen: true,
                resizable: true,
                modal: true,
                width: 458,
                Height: 184,

                buttons: {
                    "Login": function () {
                        $(this).dialog("close");
                        $("#hdfAccount").val("login");
                        $("#hdPage").val("151API");
                        $("#hdPage").val("151API");
                        $("#hdID").val($("#ID").val());
                        $("#hdPSSWD").val($("#PSSWD").val());
                        $("#hdACCID").val($("#ACCID").val());
                        $("#hdPASSWDINT").val($("#PASSWDINT").val());
                        $("#frmsetAccount").submit();
                    }                   
                },
                open: function (event) {
                    $('.ui-dialog-buttonpane').find('button:contains("Login")').focus();
                    $('.ui-dialog-buttonpane').find('button:contains("Login")').addClass('customokbutton');
                },
                close: function (event) {
                    closeMultipleAccountDialog();
                }
            });

它适用于登录按钮,表单已提交但不会在Dialog关闭时提交。请建议我解决这个问题。

1 个答案:

答案 0 :(得分:0)

因为jquery ui代码中的event.preventDefault()而无法正常工作:

        uiDialogTitlebarClose = $( "<a href='#'></a>" )
            .addClass( "ui-dialog-titlebar-close  ui-corner-all" )
            .attr( "role", "button" )
            .click(function( event ) {
                event.preventDefault();
                that.close( event );
            })

使用对话框时(“关闭”)。它将关闭对话框并阻止与click事件关联的所有其他功能。您可以删除它,您的代码也可以使用,但也会激活之前阻止的链接<a class="close-btn" href="#" id="A16">