TabPanel inside UpdatePanel - fails

  1. #1

    TabPanel inside UpdatePanel - fails

    Hello,

    A little difficult to explain, but here is my example:

    <script runat="server">
        protected void btnTest_Click(object sender, EventArgs e)
        {
            lblTest.Text = "Clicked!";
        }
    </script>
                <ExtJS:ViewPort runat="server" AutoHeight="True" AutoWidth="True" MonitorResize="True" Stateful="True">
                    <Content>
                        <ExtJS:BorderLayout runat="server" RenderHidden="True">
                            <Center Collapsible="False" CollapseMode="Mini" Split="True" MinWidth="825">
                                <ExtJS:Panel runat="server" AutoScroll="True" AutoWidth="True" Border="True">
                                    <Content>
                                        <asp:UpdatePanel runat="server">
                                            <ContentTemplate>
                                                <ExtJS:TabPanel ID="tabsCustomer" runat="server" ActiveTab="0" AutoHeight="True" AutoWidth="True">
                                                    <Tabs>
                                                        <ExtJS:Tab ID="tabCustomerSearch" runat="server" Title="Customer Search" AutoHeight="True" AutoWidth="True">
                                                            <Content>
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                Word<br />
                                                                <asp:UpdatePanel runat="server" UpdateMode="Conditional">
                                                                    <ContentTemplate>
                                                                        <asp:Label ID="lblTest" runat="server" Text="Nothing" />
                                                                        <asp:Button ID="btnTest" runat="server" Text="Test" &#111;nclick="btnTest_Click" />
                                                                    </ContentTemplate>
                                                                </asp:UpdatePanel>
                                                            </Content>
                                                        </ExtJS:Tab>
                                                    </Tabs>
                                                </ExtJS:TabPanel>
                                            </ContentTemplate>
                                        </asp:UpdatePanel>
                                    </Content>
                                </ExtJS:Panel>
                            </Center>
                        </ExtJS:BorderLayout>
                    </Content>
                </ExtJS:ViewPort>
    When the button is clicked, it scrolls to the top of the TabPanel again.

    However, remove the UpdatePanel surrounding the TabPanel and it works.

    Any ideas? Very annoying in my solution ;)

    Cheers,
    Timothy
  2. #2

    RE: TabPanel inside UpdatePanel - fails

    Hi Timothy,

    This issue is related to your other UpdatePanel post. This problem is the nested UpdatePanels. The TabPanel thinks it should update itself when the inner UpdatePanel is clicked. We're working on a fix so the controls can determine which UpdatePanel triggered the callback. Hopefully a fix will be available shortly, although it's once again a very tricky problem to solve.

    Related to this... we're also almost complete our new <AjaxEvents> feature, which will probably help avoid having to use UpdatePanels at all. An AjaxEvent can be attached to anything on the Page, including <asp:Button> controls. Attaching an AjaxEvent to a <asp:Button> will trigger an async postback (ajax request, callback) to the server.

    I'll keep you updated with our progress.
    Geoffrey McGill
    Founder

Similar Threads

  1. Updating GridPanel inside UpdatePanel
    By sedgar in forum 1.x Help
    Replies: 1
    Last Post: Aug 08, 2012, 7:06 PM
  2. [CLOSED] [1.0] Menu inside updatepanel
    By tansu in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Dec 12, 2009, 5:57 PM
  3. [CLOSED] UpdatePanel and TabPanel
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 25
    Last Post: Sep 21, 2009, 5:30 PM
  4. [CLOSED] UpdatePanel and TabPanel
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 16
    Last Post: Oct 03, 2008, 8:28 AM
  5. UpdatePanel in TabPanel
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 16
    Last Post: Aug 08, 2008, 4:10 PM

Posting Permissions