This is a migrated thread and some comments may be shown as answers.

Add tabs via ajax updater

3 Answers 58 Views

TabStrip

This is a migrated thread and some comments may be shown as answers.

Groupe CDGI asked on 18 Mar 2009, 02:55 PM

Is it possible to add tabs via an ajax updater? I'd like to do the following:

    
            Protected Sub NavMenu_ItemClick(ByVal sender As Object, ByVal e As Telerik.Web.UI.RadPanelBarEventArgs) Handles NavMenu.ItemClick 
        
                    Select Case e.Item.Value 
        
                        Case "PredefAllContacts" 
        
                            OpenTab(TabTypesEnum.TabContacts) 
        
                        Case "PredefContacts" 
        
                        Case "PredefDepartments" 
        
                        Case "PredefClients" 
        
                        Case "PredefMyOpenQueries" 
        
                        Case "PredefAllOpenQueries" 
        
                        Case "PredefAllQueries" 
        
                        Case "PredefAllParts" 
        
                    End Select 
        
                End Sub 
        
                Protected Sub OpenTab(ByVal NewTabTargetType As TabTypesEnum) 
        
                    'Scan the tabs to find the next id to create 
        
                    Dim NewTab As New Telerik.Web.UI.RadTab() 
        
                    Dim TargetName As String 
        
                    Dim TargetIndex As Integer = 0 
        
                    Select Case NewTabTargetType 
        
                        Case TabTypesEnum.TabContacts 
        
                            TargetName = "Contacts" 
        
                        Case TabTypesEnum.TabParts 
        
                            TargetName = "Parts" 
        
                        Case TabTypesEnum.TabQueries 
        
                            TargetName = "Queries" 
        
                        Case Else 
        
                            TargetName = "Contact" 
        
                    End Select 
        
                    While (From t As Telerik.Web.UI.RadTab In OpenTabs.Tabs Where t.Value = TargetName & TargetIndex).Count > 0 
        
                        TargetIndex += 1 
        
                    End While 
        
                    'The next id was found, create the tab 
        
                    NewTab.Text = TargetName 
        
                    NewTab.Value = TargetName & TargetIndex 
        
                    OpenTabs.Tabs.Add(NewTab) 
        
                    'Create a window control inside the tab 
        
                    Dim NewWindow As New Telerik.Web.UI.RadWindow() 
        
                    NewTab.Controls.Add(NewWindow) 
        
                    NewWindow.Width = NewTab.Width 
        
                    NewWindow.Height = NewTab.Height 
        
                    NewWindow.VisibleTitlebar = False 
        
                    NewWindow.VisibleStatusbar = False 
        
                    NewWindow.AutoSize = True 
        
                    NewWindow.NavigateUrl = "Contacts.aspx" 
        
                End Sub

If you look correctly i'm trying to achieve the following:
- from a panelbar item click
- open a new tab with a window control that display another page of my choice
- this other page is usually an editor of the choice of the user

It seems that if i postback the page, the redraw works because my tab gets rendered, but it doesn't via the ajax updater:

    
            <%@ Page Title="" Language="VB" AutoEventWireup="false" CodeFile="Main.aspx.vb" Inherits="Main" %> 
        
            <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
        
            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        
            <html xmlns="http://www.w3.org/1999/xhtml"> 
        
            <head id="Head1" runat="server"> 
        
                <title>Contact Web Agent 2009</title> 
        
                <link rel="Stylesheet" href="assets/css/StyleSheet.css" /> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <telerik:RadScriptManager ID="RadScriptManager1" Runat="server"></telerik:RadScriptManager> 
        
                <telerik:RadAjaxPanel ID="RadAjaxUpdater" runat="server"> 
        
                    <div id="header"> 
        
                        <asp:Image ID="Logo" runat="server" ImageUrl="assets/images/un/logo.png" ImageAlign="Left" AlternateText="Logo" CssClass="logo" /> 
        
                        <div class="title">Contact Web Agent 2009.1</div> 
        
                        <div class="subtitle"><asp:Label ID="ConnectionInfo" runat="server" Text="Vous êtes connecté en tant que: Mathieu Dumoulin"></asp:Label></div> 
        
                        <div><asp:Label ID="ConnectionDate" runat="server" Text="Ouverture de session le: 2009/03/17 15:34"></asp:Label></div> 
        
                        <div class="loggoutlink"><asp:LinkButton ID="loggoutlink" runat="server">Fermer ma session</asp:LinkButton></div> 
        
                    </div> 
        
                    <div style="clear: left;"> 
        
                        <telerik:RadSplitter ID="RadSplitter1" runat="server"  
        
                            ResizeMode="EndPane" Width="100%" Height="700px"> 
        
                            <telerik:RadPane ID="MenuSizePane" Runat="server" Width="250px"> 
        
                                <telerik:RadPanelBar ID="NavMenu" runat="server" Width="100%"> 
        
                                    <Items> 
        
                                        <telerik:RadPanelItem runat="server" Expanded="True"  
        
                                            ImageUrl="~/assets/images/un/allusers.png" PreventCollapse="True"  
        
                                            Selected="True" Text="Contacts"> 
        
                                            <Items> 
        
                                                <telerik:RadPanelItem runat="server"  
        
                                                    ImageUrl="~/assets/images/un/allusers16.png" Text="All contacts" Value="PredefAllContacts"> 
        
                                                </telerik:RadPanelItem> 
        
                                                <telerik:RadPanelItem runat="server" ImageUrl="~/assets/images/un/user16.png"  
        
                                                    Text="Contacts only" Value="PredefContacts"> 
        
                                                </telerik:RadPanelItem> 
        
                                                <telerik:RadPanelItem runat="server"  
        
                                                    ImageUrl="~/assets/images/un/department16.png" Text="Departments only" Value="PredefDepartments"> 
        
                                                </telerik:RadPanelItem> 
        
                                                <telerik:RadPanelItem runat="server" ImageUrl="~/assets/images/un/client16.png"  
        
                                                    Text="Clients only" Value="PredefClients"> 
        
                                                </telerik:RadPanelItem> 
        
                                            </Items> 
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem runat="server" Expanded="True"  
        
                                            ImageUrl="~/assets/images/un/queries.png" PreventCollapse="True"  
        
                                            Text="Service requests"> 
        
                                            <Items> 
        
                                                <telerik:RadPanelItem runat="server"  
        
                                                    ImageUrl="~/assets/images/un/myopenqueries16.png" Text="My open requests" Value="PredefMyOpenQueries"> 
        
                                                </telerik:RadPanelItem> 
        
                                                <telerik:RadPanelItem runat="server"  
        
                                                    ImageUrl="~/assets/images/un/allopenqueries16.png" Text="All open requests" Value="PredefAllOpenQueries"> 
        
                                                </telerik:RadPanelItem> 
        
                                                <telerik:RadPanelItem runat="server"  
        
                                                    ImageUrl="~/assets/images/un/allqueries16.png" Text="All requests" Value="PredefAllQueries"> 
        
                                                </telerik:RadPanelItem> 
        
                                            </Items> 
        
                                        </telerik:RadPanelItem> 
        
                                        <telerik:RadPanelItem runat="server" Expanded="True"  
        
                                            ImageUrl="~/assets/images/un/part.png" PreventCollapse="True" Text="Inventory"> 
        
                                            <Items> 
        
                                                <telerik:RadPanelItem runat="server" ImageUrl="~/assets/images/un/part16.png"  
        
                                                    Text="All parts" Value="PredefAllParts"> 
        
                                                </telerik:RadPanelItem> 
        
                                            </Items> 
        
                                        </telerik:RadPanelItem> 
        
                                    </Items> 
        
                                </telerik:RadPanelBar> 
        
                            </telerik:RadPane> 
        
                            <telerik:RadSplitBar ID="RadSplitBar1" Runat="server" BorderWidth="3px" /> 
        
                            <telerik:RadPane ID="ContentSizePane" Runat="server" Width=""> 
        
                                <telerik:RadTabStrip ID="OpenTabs" runat="server" SelectedIndex="0"  
        
                                    Height="100%" Width="100%"> 
        
                                </telerik:RadTabStrip> 
        
                            </telerik:RadPane> 
        
                        </telerik:RadSplitter> 
        
                    </div> 
        
                    </telerik:RadAjaxPanel> 
        
                </form> 
        
            </body> 
        
            </html>

3 Answers, 1 is accepted

answered on 18 Mar 2009, 04:32 PM

Perfect its working fine now, my new concern if you can help is the following:

Is there a control i could add to the viewport that could load the content of a URL. I tried the window but it's not really convenient. What i'd need is some kind of simple iframe control that allows me to load the content of the editor into the multipageview control.

Using AJAX i can switch tab and show the correct editor and everything would be all nice and simple. The second reason i'd want some kind of simple iframe control is that i want my editors to be pages, because i want to let the user click on a DETACH button and the editor will fly off to a real popup window and the tab will be removed.

Is there any way to do what i'm asking with or without specific telerik controls...

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Add tabs via ajax updater

3 Answers, 1 is accepted