Showing posts with label codebehind. Show all posts
Showing posts with label codebehind. Show all posts

Monday, March 26, 2012

How do I dynamically create TabPanels in codebehind?

I have tried creating TabPanels dynamically in Page_Init but they aren't showing up even though I do see them when doing View Source on the resulting page. When I add them statically with the designer, they do show up. I am using 10618 version of the toolkit.

Here is a code snippet:

protected void Page_Init(object sender, EventArgs e){ AjaxControlToolkit.TabPanel tp =new AjaxControlToolkit.TabPanel(); tp.ID ="DynamicTab1"; tp.HeaderText ="DynamicTab1" Label tabContents =new Label(); tabContents.Text = tp.HeaderText; tp.Controls.Add(tabContents); ExistingTabContainer.Tabs.Add(tp);}

Hi,

I'd do this dynamic tab panel creation this way (it also works in the Page_Load event handler):

protected override void OnInit(EventArgs e){base.OnInit(e);// Create the tab panel's content container Control tabContent =new Control(); TabPanel tab =new TabPanel(); tab.ID ="tabPanel1"; tab.HeaderText ="Dynamic Panel"; Label label =new Label(); label.Text ="This is a dynamic tab panel"; tabContent.Controls.Add(label); tab.Controls.Add(tabContent);this.tabContainer1.Tabs.Add(tab);}

This pice of code works for me perfect. The tabContainer1 control is of type AjaxControlToolkit.TabContainer and is declared on the page this way:

<ajaxcc:TabContainer ID="tabContainer1" runat="server"></ajaxcc:TabContainer>

Kind regards,

sbogus.



sbogus, I got it to work using your sample code. I really appreciate your help.

Cheers!

Ron

Saturday, March 24, 2012

How do I add an image button to a tab on a AJAX TabControl dynamically at runtime

How do I add an image button to a tab dynamically at runtime so that it replicates the codebehind version :-

<

ajaxToolkit:TabPanelrunat="server"ID="tabA"HeaderText=""><HeaderTemplate><asp:ImageButtonrunat="server"ID="refreshTabA"ImageUrl="./img/Refresh.gif"OnClick="refreshTabA_OnClick"/><spanstyle="">Tab A</span></HeaderTemplate>

I am building my Tabs on my TabControl dynamically and in each of the tabs I have a ReportViewer control. (So I can display multiple reports on a page 1 tab per report), this bit works ok which adds the tab and the tab title and the report, just the image button on the tab I'm missing.

TabPanel tabPanel =newTabPanel(); // Create Tab dynanically

tabPanel.ID =

"tab" + ReportName;

tabPanel.HeaderText = DisplayName;

ReportViewer reportViewer =newReportViewer(); // Create report

tabPanel.Controls.Add(reportViewer);// Add report dynamically to TabTabContainer1.Tabs.Add(tabPanel);// Add Tab to Tab Container

After much searching on the web I think I have found a solution

// Create Tab dynanically

TabPanel tabPanel =newTabPanel();

// Assign a new header template with the image and report Info which is a simple

class holding ReportName and DisplayName

tabPanel.HeaderTemplate =

newDynamicallyCreatedTemplate(ListItemType.Header, reportConfig);

Then create your Template Class

1 public class DynamicallyCreatedTemplate : ITemplate
2 {
3 //A variable to hold the type of ImageButton.
4 ListItemType _itemType;
5 ReportInfo _reportInfo;
6
7 //Constructor where we define the template type and column name.
8 public DynamicallyTemplate(ListItemType itemType, ReportInfo reportInfo)
9 {
10 //Stores the template type.
11 _itemType = itemType;
12 _reportInfo = reportInfo;
13 }
14
15 public void InstantiateIn(System.Web.UI.Control container)
16 {
17 try
18 {
19 switch (_itemType)
20 {
21 case ListItemType.Header:
22
23 // First Add the Image Button
24 ImageButton imgButton =new ImageButton();
25 imgButton.ID ="img" + _reportInfo.ReportName;
26 imgButton.ImageUrl = @."./img/Refresh.gif";
27 imgButton.Click +=new ImageClickEventHandler(refreshTabA_OnClick);
28 imgButton.ToolTip ="Refresh";
29 container.Controls.Add(imgButton);
30
31 // Then add the Tab Label
32 Literal header_ltrl =new Literal();
33 header_ltrl.Text =" " + _reportInfo.DisplayName;
34 container.Controls.Add(header_ltrl);
35 break;
36 case ListItemType.Item:break;
37 }
38 }
39 catch
40 {
41 }
42 }
43 }


hi all,

i have 3 tabs in my tabcontainer generated dynamically.

for each tab header i need to have a different active image and deactive image

eg

tab1 (active1.gif, inactive1.gif)

tab2 (active2.gif ,inactive2.gif)

has anyone tried out this.

Pls help

Thanks.