克隆 AJAX 选项卡面板

Question

尝试在我的 ajax tabcontainer 控件中克隆模板面板时遇到了一个有趣的问题。

我的想法是我在第一个选项卡上有一个自定义控件，其中列出了一些内容，要添加一个新内容，您单击自定义控件上的新按钮，这会在包含选项卡容器的控件/页面中引发一个事件.然后该控件/页面将克隆隐藏的选项卡面板并将克隆添加到选项卡容器。

使用此标记，我可以从第一个选项卡（包含列表）和任何后续选项卡（由准备克隆的隐藏选项卡面板模板化）中获得我需要的内容...

<asp:TabContainer ID="TabContainer1" runat="server">
    <asp:TabPanel ID="ui_pnl1" HeaderText="My Panel" runat="server">
        <ContentTemplate>
            <cc1:myListOfThings ID="list" runat="server" OnMyEvent="CreateTabFromTemplate" />
        </ContentTemplate>
    </asp:TabPanel>
    <asp:TabPanel ID="TemplatePanel" runat="server" Visible="false">
        <HeaderTemplate>
            <span>Hello World</span><asp:LinkButton ID="ui_btnRemove" runat="server" Text="x" />
        </HeaderTemplate>
        <ContentTemplate>
            Some content for my panel
        </ContentTemplate>
    </asp:TabPanel>
</asp:TabContainer>

好的，现在假设在我的自定义控件的第一个面板上，我有一个引发“MyEvent”事件的按钮，该事件又调用方法“CreateTabFromTemplate”。

现在我要做的是复制隐藏面板“TemplatePanel”并将其添加到选项卡容器中。

在我后面的代码中，用于将新选项卡面板添加到我的选项卡容器的方法代码的工作方式类似于...

protected void CreateTabFromTemplate(object sender, EventArgs e)
{
    // create a new tab panel
    TabPanel newPanel = new TabPanel();
    // instantiate the hidden content template from the hidden note panel in the new panel
    ui_tpNoteCreator.ContentTemplate.InstantiateIn(newPanel);
    // add the panel to the available tabs and select it
    TabContainer1.Tabs.Add(newPanel);
    TabContainer1.ActiveTab = newPanel;
}

到目前为止一切看起来都不错...但我错过了一些东西...我还没有模板化新的 tabpanels 标题...看来我所能做的就是设置文本。

按照这个例子：http://forums.asp.net/t/1108611.aspx/1 我可以做我想做的事，但我不想编写一个定义我的标题模板的类我想实例化我的标记版本的实例并将该实例传递给我的新面板。

我不相信这可以做到...这是控件的错误还是我错过了什么？！？！

有什么想法吗？

Answer 1

我刚刚测试了以下内容，据我所知。

标记：

<asp:TabContainer ID="TabContainer1" runat="server" ViewStateMode="Enabled">
        <asp:TabPanel ID="ui_pnl1" HeaderText="My Panel" runat="server">
            <ContentTemplate>
                <asp:Button ID="btnAddPanel" runat="server" Text="Add Panel" />
            </ContentTemplate>
        </asp:TabPanel>
        <asp:TabPanel ID="TemplatePanel" runat="server" Visible ="false">
            <HeaderTemplate>
                <span>Hello World</span><asp:LinkButton ID="ui_btnRemove" runat="server" Text="X" />
            </HeaderTemplate>
            <ContentTemplate>
                <p>Test Content</p>
            </ContentTemplate>
        </asp:TabPanel>
    </asp:TabContainer>

后面的代码：

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        this.btnAddPanel.Click += new EventHandler(btnAddPanel_Click);
    }

    void btnAddPanel_Click(object sender, EventArgs e)
    {
        TabPanel newPanel = new TabPanel();

        newPanel.HeaderTemplate = TemplatePanel.HeaderTemplate;
        TemplatePanel.ContentTemplate.InstantiateIn(newPanel);

        TabContainer1.Tabs.Add(newPanel);
        TabContainer1.ActiveTab = newPanel;        
    }
}

Answer 2

原来我的做法是错误的……

在分配模板和数据绑定过程之间本质上是有区别的，它仍然不完美，因为我试图将数据传递给我的标签模板，但这是基本原则......

标记：

<asp:TabContainer ID="TabContainer1" runat="server">
    <asp:TabPanel ID="ui_pnl1" HeaderText="My Panel" runat="server">
        <ContentTemplate>
            <cc1:myListOfThings ID="list" runat="server" OnMyEvent="CreateTabFromTemplate" />
        </ContentTemplate>
    </asp:TabPanel>
    <asp:TabPanel ID="TemplatePanel" runat="server" Visible="false">
        <HeaderTemplate>
            <span>Hello World</span><asp:LinkButton ID="ui_btnRemove" runat="server" Text="x" />
        </HeaderTemplate>
        <ContentTemplate>
            Some content for my panel
        </ContentTemplate>
    </asp:TabPanel>
</asp:TabContainer>

后面的代码：

protected void CreateTabFromTemplate(object sender, EventArgs e)
{
    // create a new tab panel
    TabPanel newPanel = new TabPanel();
newPanel.HeaderTemplate = TemplatePanel.HeaderTemplate;
newPanel.ContentTemplate = TemplatePanel.ContentTemplate;
    // add the panel to the available tabs and select it
    TabContainer1.Tabs.Add(newPanel);
    TabContainer1.ActiveTab = newPanel;
}

protected void TabContainer_DataBinding(object sender, EventArgs e)
{
   foreach(TabPanel panel in TabContainer.Tabs)
   {
      //identify if this is the correct tab
      if(correctTab)
      {
          // this will find a control anywhere on the panel (eg in both header and content templates)
          Label label = panel.FindControl("ControlID") as Label;
          label.Text = "Some Business Object Value";
      }
   }
}