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

scroolbar in tabstrip

1 Answer 35 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Suresh
Top achievements
Rank 1
Suresh asked on 02 Dec 2013, 01:22 PM
hi
 i am creating tab by using tabstrip with scrolling for multitab .when multiple tab is created like for e.g consider the no. of tabs as 14. initially the scrolling appears but when i  am deleting tab from 14,13, and so on at a point like when i am at tab 8 after deleting the scrolling disappears along with the starting tabs i.e tab1,tab2,tab3. Scrolling disappearing at a point is right but the starting tabs are hidden which causes a problem. pls help me fast.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

 

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
    <title></title>
    
    <link href="Style.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
   <%-- <telerik:RadSkinManager ID="QsfSkinManager" runat="server" ShowChooser="true" />
    <telerik:RadFormDecorator ID="QsfFromDecorator" runat="server" DecoratedControls="All" EnableRoundedCorners="false" />--%>
 
        <%--<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="ScrollButtonsOptionsList">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                   
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="PerTabScrollingCheckBox">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadTabStrip1" />
                 
                </UpdatedControls>
            </telerik:AjaxSetting>
           
        </AjaxSettings>
    </telerik:RadAjaxManager>--%>

    <div class="exampleWrapper">
        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" Width="400px" ScrollChildren="true" ScrollButtonsPosition="Middle" PerTabScrolling="true" ScrollPosition="0"
            SelectedIndex="0">
            <Tabs>
                <telerik:RadTab Text="Advanced">
                </telerik:RadTab>
                <telerik:RadTab Text="Automatic Updates">
                </telerik:RadTab>
                <telerik:RadTab Text="Remote">
                </telerik:RadTab>
                <telerik:RadTab Text="General">
                </telerik:RadTab>
                <telerik:RadTab Text="Computer Name">
                </telerik:RadTab>
                <telerik:RadTab Text="Hardware">
                </telerik:RadTab>
                <telerik:RadTab Text="System Restore">
                </telerik:RadTab>
            </Tabs>
        </telerik:RadTabStrip>

    </div>
 
   
 
  <%--  <div style="clear: both;"></div>--%>
 
   
    
 
    </form>
</body>
</html>

my code behind file:

using Telerik.Web.UI;

    public partial class Default2 : System.Web.UI.Page
{
        protected void Page_Load(object sender, EventArgs e)
        {
            var tabTemplate = new TabTemplate();
            foreach (RadTab tab in RadTabStrip1.Tabs)
            {
                tabTemplate.InstantiateIn(tab);
            }

        }
        protected void ScrollButtonsOptionsList_SelectedIndexChanged(object sender, EventArgs e)
        {
           // RadTabStrip1.ScrollButtonsPosition = (TabStripScrollButtonsPosition)Enum.Parse(typeof(TabStripScrollButtonsPosition), ((RadioButtonList)sender).SelectedValue);
           
        }
 
        protected void PerTabScrollingCheckBox_CheckedChanged(object sender, EventArgs e)
        {
            //RadTabStrip1.PerTabScrolling = ((CheckBox)sender).Checked;
            //RadTabStrip1.ScrollPosition = 0;
           
        }
        public class TabTemplate : ITemplate
        {
            public void InstantiateIn(Control container)
            {
                Label label1 = new Label();
                label1.ID = "ItemLabel";
                label1.Text = (container as RadTab).Text;
                container.Controls.Add(label1);
                ImageButton imgRemove = new ImageButton();
                imgRemove.Init += imgRemove_Init;
                imgRemove.ID = "ImageButton1";
                imgRemove.Width = Unit.Pixel(9);
                imgRemove.Height = Unit.Pixel(9);
                imgRemove.ImageUrl = "~/cut.png";
                container.Controls.Add(imgRemove);
            }
            void imgRemove_Init(object sender, EventArgs e)
            {
                ImageButton img = (ImageButton)sender;
                img.Click += imgRemove_Click;

            }

            void imgRemove_Click(object sender, ImageClickEventArgs e)
            {
                ImageButton img = (ImageButton)sender;
                RadTab tab = img.Parent as RadTab;

                tab.TabStrip.SelectedIndex = tab.Index - 1;
               
                tab.TabStrip.Tabs.Remove(tab);
            }
        }


        protected void ReorderTabsOnSelectCheckBox_CheckedChanged(object sender, EventArgs e)
        {
            
        }
    }


1 Answer, 1 is accepted

Sort by
0
Nencho
Telerik team
answered on 03 Dec 2013, 09:38 AM
Hello Suresh,

I was able to replicate the described issue, base on the provided code snippet and steps to reproduce. The bug is already forwarded to our developer team for further consideration. Thank you for pointing that out. We will do our best, in order to fix the issue as soon as possible.

Regards,
Nencho
Telerik
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Tags
TabStrip
Asked by
Suresh
Top achievements
Rank 1
Answers by
Nencho
Telerik team
Share this question
or