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)
{
}
}
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)
{
}
}