如何让 fancybox 内的 UpdatePanel 工作

发布于 2024-09-28 17:37:43 字数 1723 浏览 5 评论 0原文

我使用 fancybox 在单击链接时显示 div 的内容。使用下面的代码可以实现这一点：

<a id="popupTrigger" href="#popup">popup trigger</a>

<div style="display:none">
    <div id="popup">
        <asp:UpdatePanel ID="HerkomstCodeUpdatePanel" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                This content displays inside fancybox.
                <asp:TextBox ID="CurrentTimeTextBox" runat="server"></asp:TextBox>
                <asp:Button ID="RefreshContentButton" runat="server"></asp:Button>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
</div>

和 JScript：

$(document).ready(function () {
    $("#popupTrigger").fancybox({
        autoDimensions: false,
        height: 250,
        transitionIn: 'elastic',
        transitionOut: 'elastic',
        width: 400
    });
});

现在我期望它会做的是，当您单击按钮（显示在 fancybox 内）时，它会更新文本框并执行我在代码隐藏中定义的任何操作。不幸的是，当我点击按钮时什么也没有发生。

我尝试自己触发 __doPostback 传递 updatepanel 的 ClientID 和/或按钮本身。然而，我似乎无法在代码隐藏中触发该事件。

问题是，如果我删除 fancybox，更新面板将按预期工作。所以我猜测在创建 fancybox 之前我是否可以以某种方式找出按钮后面的事件处理程序逻辑，我也许可以在附加 fancybox 后重新创建事件处理程序逻辑？我只是在任何地方都找不到它...

我正在使用 ASP.Net WebForms 3.5 和 JQuery 1.4.1

更新

我让它通过覆盖按钮上的客户端单击事件来触发代码隐藏的button_click事件使用下面的代码。关键在于使用按钮的名称作为 __doPostBack 事件的发送者对象。剩下的唯一问题是所有其他值都不再回传。如果我在文本框中输入任何内容，单击按钮，我的代码隐藏不再知道文本框中有什么。

$("#popupTrigger").fancybox({
    //.... other options,
    onComplete: function () {
        $("#RefreshContentButton").click(function () {
            __doPostBack($(this).attr('name'), '');
        });
    }
});

原文

I'm using fancybox to display the contents of a div when clicking a link. This works using the code below:

<a id="popupTrigger" href="#popup">popup trigger</a>

<div style="display:none">
    <div id="popup">
        <asp:UpdatePanel ID="HerkomstCodeUpdatePanel" runat="server" UpdateMode="Conditional">
            <ContentTemplate>
                This content displays inside fancybox.
                <asp:TextBox ID="CurrentTimeTextBox" runat="server"></asp:TextBox>
                <asp:Button ID="RefreshContentButton" runat="server"></asp:Button>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>
</div>

And the JScript:

$(document).ready(function () {
    $("#popupTrigger").fancybox({
        autoDimensions: false,
        height: 250,
        transitionIn: 'elastic',
        transitionOut: 'elastic',
        width: 400
    });
});

Now what I'm expecting it would do is that when you click the button (which is displayed inside fancybox) it would update the textbox and do whatever I define it to do in the codebehind. Unfortunately nothing happens when I click the button.

I've tried to trigger a __doPostback myself passing the ClientID of the updatepanel and/or the button itself. I can't seem to trigger the event in the codebehind however.

The thing is if I remove the fancybox, the updatepanel works as expected. So I am guessing if I can somehow find out what eventhandler logic is behind the button before I create the fancybox, I might be able to recreate the eventhandler logic after attaching fancybox? I just can't find it anywhere...

I am using ASP.Net WebForms 3.5 and JQuery 1.4.1

Update

I got it to trigger the codebehind button_click event by overriding the clientside click event on the button using the code below. The key is in using the name of the button as the sender object for the __doPostBack event. The only problem that remains is that all other values aren't posted back anymore. If I type anything in the textbox, click the button, my codebehind doesn't know what's in the textbox anymore.

$("#popupTrigger").fancybox({
    //.... other options,
    onComplete: function () {
        $("#RefreshContentButton").click(function () {
            __doPostBack($(this).attr('name'), '');
        });
    }
});

分享到QQ

分享到微博