Wednesday, March 21, 2012

TabContainer and ModalPopupExtender

Hi,

my problem:

I have a TabContainer with 2 tabs. And I have a Panel to use with the ModalPopupExtender...

Now I create one ModalPopup in the first tab and a second ModalPopup in the second tab. In both tabs the Popup is fired by a ImageButtton. Both ModalPopup's have the same PopupControlID but it only works, when I use only one ModalPopup... When I use the two ModalPopups the Panel don't show; just the background is black/transparent when I clicked the ImageButon... I think the follow code describe my problem at best:

 <cc1:TabContainer ID="TabContainer1" runat="server"> <cc1:TabPanel ID="TabPanel1" runat="server"> <HeaderTemplate>Tab one</HeaderTemplate> <ContentTemplate> <cc1:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="ImageButton1" PopupControlID="Panel1" CancelControlID="CancelButton" BackgroundCssClass="modalBackground" DropShadow="True" DynamicServicePath="" Enabled="True" /> <asp:ImageButton ID="ImageButton1" runat="server" /> </ContentTemplate> </cc1:TabPanel> <cc1:TabPanel ID="TabPanel2" runat="server"> <HeaderTemplate>Tab two</HeaderTemplate> <ContentTemplate><%--<cc1:ModalPopupExtender ID="ModalPopupExtender2" runat="server" TargetControlID="ImageButton2" PopupControlID="Panel1" CancelControlID="CancelButton" BackgroundCssClass="modalBackground" DropShadow="True" DynamicServicePath="" Enabled="True" />--%> <asp:ImageButton ID="ImageButton2" runat="server" /> </ContentTemplate> </cc1:TabPanel> </cc1:TabContainer> <asp:Panel ID="Panel1" runat="server" Height="400px" Width="400px" BackColor="white"> <h1>Here's my Popup!</h1> <asp:Button ID="CancelButton" runat="server" Text="Cancel" /> </asp:Panel>
 Now, when you comment out the "ModalPopupExtender2" you will see, the Popup is doesn't show (in both tabs)...


Is there no solution for this problem?


You could try to "work around" it, by:

- create another hidden button (style="display:none;"... )

- use that hidden button as the targetcontrolID.

- in the ImageButton1 and ImageButton2 click events, use the ModalPopupExtender1.Show() and ModalPopupExtender2.Show()

- to close the popup, same way using the.Hide()

(-->I would recommend just creating two popup panels, even if they are identical in content.. )


Yeah, but in this way I have a Postback...


Use updatepanels to avoid the full postback..

No comments:

Post a Comment