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

Rad Tab Text style change

2 Answers 222 Views

TabStrip

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

2 Answers, 1 is accepted

answered on 20 May 2009, 08:07 AM

Hello Suresh,

Try the following client side code for changing the color of RadTab text.

JavaScript:

    
            <script type="text/javascript" language="javascript"> 
        
            function ChangeColor(sender, eventArgs) 
        
            { 
        
                var tabStrip = $find("<%= RadTabStrip1.ClientID %>"); 
        
                var tab = tabStrip.findTabByText('Root RadTab1 with long text'); 
        
                if(condition) // Condition 
        
                { 
        
                    tab.get_textElement().style.color = 'Green'; 
        
                } 
        
            } 
        
            </script>

Thanks,
Shinu.

answered on 21 May 2009, 12:48 PM

Hi Suresh,

Please find below a sample code snippet that shows the needed approach.

    
            <html xmlns="http://www.w3.org/1999/xhtml">  
        
            <head runat="server">  
        
                <title></title>  
        
                <style type="text/css">  
        
                    .red  
        
                    {  
        
                        color: Red !important;  
        
                    }  
        
                </style> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server">  
        
                <asp:ScriptManager ID="ScriptManager1" runat="server">  
        
                </asp:ScriptManager> 
        
                <script type="text/javascript">  
        
                    function changeColor() {  
        
                        var tabStrip = $find('<%= RadTabStrip1.ClientID %>');  
        
                        var tab = tabStrip.findTabByText("Root RadTab2");  
        
                        if (tab) // Condition    
        
                        {  
        
                            tab.set_cssClass("red");  
        
                        }  
        
                    }    
        
                </script> 
        
                <telerik:RadTabStrip ID="RadTabStrip1" runat="server">  
        
                    <Tabs> 
        
                        <telerik:RadTab runat="server" Text="Root RadTab1">  
        
                        </telerik:RadTab> 
        
                        <telerik:RadTab runat="server" Text="Root RadTab2">  
        
                        </telerik:RadTab> 
        
                        <telerik:RadTab runat="server" Text="Root RadTab3">  
        
                        </telerik:RadTab> 
        
                        <telerik:RadTab runat="server" Text="Root RadTab4">  
        
                        </telerik:RadTab> 
        
                        <telerik:RadTab runat="server" Text="Root RadTab5">  
        
                        </telerik:RadTab> 
        
                    </Tabs> 
        
                </telerik:RadTabStrip> 
        
                <input id="Button1" type="button" value="button" onclick="changeColor()" /> 
        
                </form> 
        
            </body> 
        
            </html>

Greetings,
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.

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

Rad Tab Text style change

2 Answers, 1 is accepted