带有用户控件的延迟加载选项卡

Question

我想在 AJAX 选项卡容器中使用延迟加载选项卡。我已经实施了。但我面临的问题是，当我单击按钮或触发该用户控件中的任何事件时，它不会被触发；没发生什么事。

<asp:TabContainer runat="server" ID="TabContainerUp" 
        ActiveTabIndex="0" AutoPostBack="true" OnActiveTabChanged="TabContainerUp_ActiveTabChanged">
        <asp:TabPanel ID="tab1" runat="server">
            <HeaderTemplate>
                <img src="images/uc1.png" alt="" />
            </HeaderTemplate>
            <ContentTemplate>
                <asp:Panel ID="pnlUC1" runat="server">
                </asp:Panel>
            </ContentTemplate>
        </asp:TabPanel>
        <asp:TabPanel ID="tab2" runat="server">
            <HeaderTemplate>
                <img src="images/uc2.png" alt="" />
            </HeaderTemplate>
            <ContentTemplate>
                <asp:Panel ID="pnlUC2" runat="server">
                </asp:Panel>
            </ContentTemplate>
        </asp:TabPanel>
    </asp:TabContainer>

代码隐藏：

    protected void TabContainerUp_ActiveTabChanged(object sender, EventArgs e)
    {
        string tabName = TabContainerUp.ActiveTab.ID;
        getActiveTab(tabName);
    }

    public void getActiveTab(string tabName)
    {
        UserControl uc;
        //uc.
        switch (tabName)
        {
            case "tab1":
                pnlUC1.Controls.Clear();
                uc = Page.LoadControl("~/Controls/UC1.ascx") as UserControl;
                pnlUC1.Controls.Add(uc);
                break;
            case "tab2":
                pnlUC2.Controls.Clear();
                uc = Page.LoadControl("~/Controls/UC1.ascx") as UserControl;
                pnlUC2.Controls.Add(uc);
                break;
        }
    }

Answer 1

您需要最迟在Page_Load 中的每个回发上重新创建动态创建的控件，并使用与以前相同的 ID。因此，您可以在ActiveTabChanged 中加载并将它们添加到您的面板中，但您需要在Page_Init/Page_Load 的下一次回发中重新创建它们。因此，您需要将要重新创建的内容存储在某个地方（例如在 Session 中）。

但我假设您使事情变得比必要的更复杂，您甚至可以简单地创建这些 UserControls，甚至以声明方式（在 aspx 上），初始 Visible 状态为 false。然后您只需要在ActiveTabChanged 中根据需要切换控件的可见性。

注意：不可见的服务器端 web 控件根本不会呈现给客户端，也不会保存 ViewState。所以声明它们没有缺点。

Lazy-Load 并不意味着您尽可能晚地创建这些控件，而是意味着您尽可能晚地对它们进行数据绑定。因此，永远不要将它们从page_load（例如在 UserControl 中）绑定到数据库，而只能从在必要时从页面调用的方法（这里从 ActiveTabChanged）绑定到数据库。因此，您可以在 UserControl UC1 中实现公共方法 BindData。

这是一个简单的例子：

switch (tabName)
{
    case "tab1":
        UC1_1.Visible = true;
        UC1_1.BindData();
        UC1_2.Visible = false;
        break;
    case "tab2":
        UC1_1.Visible = false;
        UC1_2.Visible = true;
        UC1_2.BindData();
        break;
}

在你的UserControl

public void BindData()
{
    // put here all your databinding stuff 
    // that is in page_load now ...
}

这可能是关于延迟加载 ajax TabPanels 的最佳教程：

• http://mattberseth.com/blog/2007/07/how_to_lazyload_tabpanels_with.html