Sunday, June 07, 2009

How to add AJAX tab control at run time?

Hello friends,
Today we will discuss how to add Ajax tab control at run time.

As you know for adding tab control in our page we require two Ajax controls one is AJAX Tab Container and second is AJAX tab Panel control.
AJAX tab container is main control and Tab Panel is child control. Now you have to follow step as follow.

Step 1:-
For this first just drag drop a Tab Container on our aspx page.

Step 2 :- Now you have to add panel in tab container for that we have to work in special method of tab Container which is tab Initialize method.
It means you have to work in below event.
Private Sub tabCont_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles tabCont.Init
Try
Me.pvt_DefineTabControl()
Catch ex As Exception
Throw ex
End Try
End Sub
Here I have created a Define tab control method in which we define tab control at run time.
According to my knowledge if you do not use this tab initialize method than you can not use run time control creation. So this event is must when you creating run time tab control

Step3 :- you are thinking what is pvt_DefineTabControl method so it’s a simple work as you see below.
Private Sub pvt_DefineTabControl()
Try
If Me.tabCont.Tabs.Count > 0 Then
Me.tabCont.Tabs.Clear()
End If
If Session("Counter") Is Nothing OrElse Trim(Session("Counter")) = String.Empty Then
Session("Counter") = 1
End If
For intI As Integer = 0 To CInt(Session("counter")) - 1
Dim tabPan As New TabPanel
Dim btnPanelNumber As New Button
btnPanelNumber.ID = "btnPanel" & intI.ToString
btnPanelNumber.Text = "Click me to create Panel " & (intI + 1).ToString
AddHandler btnPanelNumber.Click, AddressOf MyButtonClick
tabPan.Controls.Add(btnPanelNumber)
tabPan.HeaderText = "Panel" & intI.ToString
Me.tabCont.Controls.Add(tabPan)
Next
Catch ex As Exception
Throw ex
End Try
End Sub
Step 4: here I have added one Button in Tab Panel for this I used a common Click event handler which is MyButtonClick
By default there is a single TabPanel when you click button in tab Panel then you will get next panel.
Private Sub MyButtonClick(ByVal sender As Object, ByVal e As System.EventArgs)
Try
Session("Counter") = Session("Counter") + 1
Dim strButtonId As String = CType(sender, Button).ID
Dim intId As Integer = CInt(strButtonId.Replace("btnPanel", 0))
Me.pvt_DefineTabControl()
Me.tabCont.Tabs(intId).HeaderText = "You have Clicked me" + intId.ToString + "Panel's Button"
Catch ex As Exception
Throw ex
End Try
End Sub

Step 5:- For Example you can visit on http://indiadotnetajaxtabwork.tk/

and download code also.

Thanks & Regards
Rajat
Enjoy Coding :)
Enjoy Ajax tool kit :)

for more information http://www.indiandotnet.wordpress.com