开发者

How to get an UpdatePanel inside fancybox working

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'), '');
        });
    }
});


The problem lies within fancybox. It actually places you controls outside the form when it displays them. What you need to do is modify you fancybox plugin like this (fancybox vers. 1.3.4):

$('body').append(... becomes $('body > form').append(...

And presto everything works :)


Hmm from a quick glance I'd say you need to postback more than just the name attribute. This would probably be the reason as to why your backend doesn't know what text is current (since it hasn't been postbacked)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜