Question

我的ShowData.aspx页面上有一个链接，我正在调用fancybox。

<a href="EditData.aspx" id="editLink">Edit Data</a>

我的JQuery代码是：

$("#editLink").fancybox({
                        'opacity': true,
                        'overlayShow': true,
                        'transitionIn': 'elastic',
                        'transitionOut': 'none'                                                        
                    });

EditData.aspx表单包含一个保存按钮。我的问题是，单击“保存”按钮后，对话框不会关闭。此外，在服务器上执行保存后，客户端页面将重定向到EditData.aspx。

预期结果是对话框关闭，我返回到父页面（ShowData.aspx）。

谢谢！

Answer 1

我删除了fancybox，发现常规JQuery对话框也会出现此问题。如果您加载具有提交按钮的页面（或以任何方式回发），则对话框将消失，主页面将重定向到对话框页面。这是一个简单的测试：

HTML：

<div id="divClick"></div>

JQuery的：

$(function () {
            $("#divClick").dialog({
                modal: true,
                open: function () {
                    $(this).load('Postback.aspx');
                },
                title: 'Ajax Page'
            });
        });

Postback.aspx：

<body>
    <form id="form1" runat="server">
    <div>

    </div>
    Enter Name:
    <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
    <asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
    </form>
</body>

有没有办法将事件附加到对话框的回发中？

此外，我修改了Postback.aspx以包含jscolor.js（一个JQuery插件）以查看它是否可行，它不起作用。任何JQuery功能似乎都不适用于对话框。

Answer 2

我最终使用了iFrame。这似乎可以完成这项工作。

MainPage.aspx

<div id="divClick"><iframe src="Postback.aspx"></iframe></div>

JQuery的：

 $(function () {
       $("#divClick").dialog({
          modal: true,                
          title: 'iFrame Page',
          width: 500,
          height: 500
       });
   });

Postback.aspx中的JQuery插件运行良好，回发后不会关闭对话框并重定向主页面。

Fancybox AJAX - 如何在回发后关闭对话框

2 个答案: