delete tabs on server side

[Atiq Ur Rehman]

Hi,

I am trying to implement a Firefox type tab add/delete option for tab strip. The tab strip, tabs and multipage are generated dynamically and I also want to delete them on server side event. Right now I have a delete button in each page view which deletes the pageview and related tab. It works fine but very confusing for the user so I want to implement firefox type delete where you can delete the tab from the cross button on the tab. As I have to delete the tab and associated pageview and also do some other stuff when someone clicks the delete tab button, this has to be server side. I saw this example http://www.telerik.com/community/forums/aspnet-ajax/tabstrip/create-dynamic-closable-radtab-and-radmultipage-server-side.aspx and tried doing an image button instead of htmlimage for clientside delete but that doesn't work. It does add the image button on the tab but if you do anything which causes postback you get an error saying "Multiple controls with the same ID 'i0' were found. FindControl requires that controls have unique IDs."
I have investigated the error and it is because of the same ids given to more than one tabs. I tried setting tabid but it is read only.
This is part of a big project and I can't just copy the code here, I would have to create a seperate project. Also the way I am using tabs and pageviews is that there is one tab strip with a multipage and then each page view in multipage has another tabstrip and multipage. So its like nested tab strip in a page view.
Can anyone please help me with this?

[Atiq Ur Rehman]

I would also like to add that I am using dotnetnuke and dynamic place holder.

[Atanas Korchev]

Hello Atiq Ur Rehman,

I have created a sample web page which demonstrates how to add and delete tabs.

I hope this helps,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Atiq Ur Rehman]

Hi thanks for the reply.

I have seen the example you sent but my scenario is different. I have a placeholder on the page and I am creating the tab strip dynamically. Can you please provide an example like that?

Thanks
Atiq

[Atanas Korchev]

Hi Atiq Ur Rehman,

Find attached the modified demo page.

Regards,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Atiq Ur Rehman]

Hi I have tried it in my solution but it doesn't work for me. I have created a solution which is very near to what I am doing. As I can't attach here I am sending it from support ticket. Please have a look and let me know how to make that work.

I have just submitted the ticket and ticket id is 198138.

Thanks
Atiq

[Paul]

Hello Atiq,

Unfortunately, we do not support Denis Bauer's DynamicControlsPlaceholder. Here's your modified code snippet that works just fine using asp:PlaceHolder.

ASPX:

    <form id="form1" runat="server">
        <telerik:RadScriptManager runat="Server" ID="RadScriptManager1">
        </telerik:RadScriptManager>
        <asp:Button runat="server" ID="AddTabButton" Text="Add new tab" />
        <asp:PlaceHolder runat="server" ID="PlaceHolder1"></asp:PlaceHolder>
        <%--<DBWC:DynamicControlsPlaceholder ID="DynamicControlsPlaceholder1" runat="server">
        </DBWC:DynamicControlsPlaceholder>--%>
    </form>

Code-behind:

Imports Telerik.Web.UI

Partial Class _Default
    Inherits System.Web.UI.Page

    ''' <summary>
    ''' This is the click handler of the delete button. The associated tab is the Parent of the ImageButton
    ''' </summary>
    Protected Sub DeleteButton_Click(ByVal sender As Object, ByVal e As ImageClickEventArgs)
        Dim clickedTab = CType(CType(sender, ImageButton).Parent, RadTab)
        DeleteTabAndPageView(clickedTab)
    End Sub

    Dim RadTabStrip1 As RadTabStrip
    Dim RadMultiPage1 As RadMultiPage

    ''' <summary>
    ''' Dynamic controls should be instantiated during the Page_Init phase
    ''' </summary>
    Protected Sub Page_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
        'Create a new tabstrip and add it to the placeholder
        RadTabStrip1 = New RadTabStrip
        RadTabStrip1.ID = "RadTabStrip1"
        PlaceHolder1.Controls.Add(RadTabStrip1)
        RadTabStrip1.SelectedIndex = 0
        RadTabStrip1.Skin = "Vista"

        'Subscribe to the TabCreated event - in the event handler we will add the image button control
        AddHandler RadTabStrip1.TabCreated, AddressOf Me.RadTabStrip1_TabCreated

        'Create a new multipage and add it to the placeholder
        RadMultiPage1 = New RadMultiPage
        RadMultiPage1.ID = "RadMultiPage1"
        RadMultiPage1.SelectedIndex = 0
        PlaceHolder1.Controls.Add(RadMultiPage1)

        'Subscribte to the PageViewCreated event - in the event handler we will populate the pageview with controls
        AddHandler RadMultiPage1.PageViewCreated, AddressOf Me.RadMultiPage1_PageViewCreated
        'Wire up the tabstrip and the multipage
        RadTabStrip1.MultiPageID = "RadMultiPage1"
    End Sub

    Protected Sub RadTabStrip1_TabCreated(ByVal sender As Object, ByVal e As RadTabStripEventArgs)
        Dim button As ImageButton = New ImageButton
        button.ImageUrl = "~/delete.gif"
        AddHandler button.Click, AddressOf Me.DeleteButton_Click

        e.Tab.Controls.Add(New LiteralControl(e.Tab.Text))
        e.Tab.Controls.Add(button)
    End Sub

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

        If Not Page.IsPostBack Then
            'Add two tabs and two pageviews
            AddTabAndPageView()
            AddTabAndPageView()
        End If

        'Call the DataBind method so any databinding expressions in the TabTemplate are evaluated ( <%# DataBinder.Eval (...) )
        RadTabStrip1.DataBind()
    End Sub

    Private Sub AddTabAndPageView()
        Dim tab As New RadTab
        tab.Text = "Tab " & RadTabStrip1.Tabs.Count
        RadTabStrip1.Tabs.Add(tab)

        Dim pageView As New RadPageView
        'Always assign the ID of the pageview
        pageView.ID = "PageView" & Guid.NewGuid.ToString
        RadMultiPage1.PageViews.Add(pageView)

        'Call the DataBind method so any databinding expressions in the TabTemplate are evaluated ( <%# DataBinder.Eval (...) )
        RadTabStrip1.DataBind()
    End Sub

    Private Sub DeleteTabAndPageView(ByVal tab As RadTab)
        'Get the associated pageview
        Dim pageView As RadPageView = tab.PageView
        RadMultiPage1.PageViews.Remove(pageView)

        RadTabStrip1.Tabs.Remove(tab)
    End Sub

    ''' <summary>
    ''' Fired when a new pageview is added. Populate the pageview with controls here.
    ''' </summary>
    Protected Sub RadMultiPage1_PageViewCreated(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadMultiPageEventArgs)
        Dim pageViewContents As Label = New Label
        pageViewContents.ID = e.PageView.ID & "Label"
        pageViewContents.Text = "RadPageView" & e.PageView.Index

        e.PageView.Controls.Add(pageViewContents)
    End Sub

    Protected Sub AddTabButton_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles AddTabButton.Click
        AddTabAndPageView()
    End Sub
End Class

All the best,
Paul
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Atiq Ur Rehman]

Hi paul,

I have heard this before but your controls do work with it. Here is a link to prove it http://www.telerik.com/community/forums/aspnet-ajax/tabstrip/dynamic-pageviews-tabs-and-multi-page.aspx. You only have to try a little harder. I would be glad if you could do that? You have copied the same code which you sent me in the last reply. Dynamic place holder is absolutly necessary, so I have to use it. Another thing why can't we assign ID to a tab? I think thats what throwing the error.

Thanks
Atiq

[Atanas Korchev]

Hi Atiq Ur Rehman,

We have already demonstrated how to make it work with the PlaceHolder control. As we said earlier in this and the other forum thread we do not support the DynamicControlsPlaceholder and will not adapt our sample project to support it. If using DynamicControlsPlaceholder is mandatory you should adapt the sample code to use it as you have done before.

Regards,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.

[Atiq Ur Rehman]

Thanks very helpfull.