ASP.NET回发后关闭jQuery模式对话框再次打开它

时间:2012-03-05 02:28:47

标签: javascript jquery asp.net jquery-ui jquery-ui-dialog

我有一个HTML链接,打开一个包含iFrame的jQuery模式对话框。此iFrame包含一个表单,该表单应在回发后关闭对话框(OkCancel)。

在我的回发中,我向iFrame添加了一个关闭对话框的Javascript函数,它运行正常。但问题是,在用户按下OkCancel按钮后,对话框将关闭并再次打开!我做错了什么?

这是我的代码:

调用HTML页面:

<html>
<head>
    <link rel="stylesheet" type="text/css" href="theme/south-street.css" media="screen" id="themeCSS" />

    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#dlgConfirm").dialog({
                autoOpen: false,
                resizable: false,
                modal: true,
                width: 550,
                height: 300,
                close: function (event, ui) { alert('closed') }
            })
        });


        function fConfirm(tId) {
            alert('ddd');
            $('#dlgConfirm').children().attr('src', 'ConfirmTracking.aspx?tId=' + tId)
            .load(function () {
                $("#dlgConfirm").dialog('open');
            });
            return false;
        }
    </script>
</head>
<body>
    <div style="display: none">
        <div id="dlgConfirm" title="Confirm Tracking" style="padding: 0px">
            <iframe style="margin: 0px; padding: 0px" marginheight="0" marginwidth="0" src="" width="100%" height="100%" frameborder="0"></iframe>
        </div>
    </div>

    <a href="#" onclick="return fConfirm('109')">Click me</a>
</body>
</html>

iFrame页面

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ConfirmTracking.aspx.cs" Inherits="Chicken.ConfirmTracking" %>
<html>
<head runat="server">
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui-1.8.16.custom.min.js"></script>
    <script type="text/javascript">
        function CloseThis() {
            parent.$('#dlgConfirm').dialog('close');
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <br />
        <asp:TextBox ID="edtTrackingNo" runat="server"></asp:TextBox>
        <br /><br />
    <asp:Button ID="btnOk" runat="server" Text="Ok" />
    <asp:Button ID="btnCancel" runat="server" onclick="Cancel_Click" Text="Cancel" />
    </form>
</body>
</html>

iFrame Codebehind:

using System;

namespace Chicken {
    public partial class ConfirmTracking: System.Web.UI.Page {
        protected void Page_Load(object sender, EventArgs e) {

        }

        protected void Cancel_Click(object sender, EventArgs e) {
            ClientScript.RegisterClientScriptBlock(this.GetType(), "none", "<script>$(function(){CloseThis()});</script>");
        }
    }
}

1 个答案:

答案 0 :(得分:1)

我设法跟踪您的问题,关闭对话框后,function fConfirm(tId)中的加载会再次触发。这似乎是一个错误。修复此问题的一种混乱方法是向页面添加一个全局变量并将其设置为true以显示通过函数打开对话框然后在打开对话框之前如果变量为true则打开对话框。不要再次将变量设置为false,以便在需要时重新打开对话框。

您的功能如下所示:

    var loadedByFunction = false;

    function fConfirm(tId) {
        loadedByFunction = true;
        $('#dlgConfirm').children().attr('src', 'ConfirmTracking.aspx?tId=' + tId)
        .load(function () {
            if (loadedByFunction) {
                loadedByFunction = false;
                $("#dlgConfirm").dialog('open');
            }
        });
        return false;
    }