How to change Images on ‘RadTab” based on Events.

[Ranganath]

Hi,

I am trying to place Images on the RadTab,But I want to change the Images based on Events.

I.e. I want to change the Images when ever Focus Lost/On Mouse Move events.

Please Guide me with an example , how to implement this.

[Paul]

Hello Ranganath,

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

 <form id="form1" runat="server">

    <script type="text/javascript">
    function setImage()
    {
        var tabstrip = $find('<%= RadTabStrip1.ClientID %>');
        tabstrip.get_tabs().getTab(0).set_imageUrl("1.jpg");
        //tabstrip.get_tabs().getTab(0).set_imageUrl("1.jpg")
        //tabstrip.get_tabs().getTab(0).set_hoveredImageUrl("1.jpg")
        //tabstrip.get_tabs().getTab(0).set_disabledImageUrl("1.jpg")
        //tabstrip.get_tabs().getTab(0).set_selectedImageUrl("1.jpg")
    }
    </script>

    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>

    <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>
        </Tabs>
    </telerik:RadTabStrip>
    <input id="Button1" type="button" value="button" onclick="setImage()" />
</form>

All the best,
Paul
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.