New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Events

RadTabStrip supports a number of client-side events that let you customize the behavior of the tab strip:

To use these events, simply write a javascript function that can be called when the event occurs. Then assign the name of the javascript function as the value of the the corresponding RadTabStrip property.

<script type="text/javascript">
function OnClientTabSelectingHandler(sender, args)
{
    var tab = args.get_tab();
    var navigateUrl = tab.get_navigateUrl();
    if (navigateUrl != "#")
    {
        var proceed = confirm("Navigate to "+ navigateUrl + " ?");
        if (!proceed)
        {
            args.set_cancel(true);
        }
    }
}
</script>

<telerik:RadTabStrip RenderMode="Lightweight" ID="RadTabStrip1" runat="server" OnClientTabSelecting="OnClientTabSelectingHandler">
...
</telerik:RadTabStrip> 

You can also assign event handlers in client-side code. When using the client-side API, pass a reference to the event handler rather than its name. One advantage of using the client-side API is that you can attach multiple event handlers to one event using the standard MS AJAX convention:

function Handler1()
{
    alert("First handler called");
}
function Handler2()
{
    alert("Second handler called");
}
function pageLoad()
{
    var tabStrip = $find(<%=RadTabStrip1.ClientID%>);

    tabStrip.add_tabSelecting(Handler1);
    tabStrip.add_tabSelecting(Handler2);
}           

Another advantage of the client-side API is that you can detach an event handler dynamically:

function removeOnClicked2()
{
    var tabStrip = $find(<%=RadTabStrip1.ClientID%>);
    tabStrip.remove_tabSelecting(Handler2);
}       

Note that on the client-side, the names of events are slightly different than on the server side. The following table shows the correspondence between client-side and server-side names:

 

Server-Side Name Client-SideName Methods to add and Remove
OnClientLoad load add_load, remove_load
OnClientContextMenu contextMenu add_contextMenu, remove_contextMenu
OnClientDoubleClick doubleClick add_doubleClick, remove_doubleClick
OnClientMouseOver mouseOver add_mouseOver, remove_mouseOver
OnClientMouseOut mouseOut add_mouseOut, remove_mouseOut
OnClientTabDisabled tabDisabled add_tabDisabled, remove_tabDisabled
OnClientTabEnabled tabEnabled add_tabEnabled, remove_tabEnabled
OnClientTabSelected tabSelected add_tabSelected, remove_tabSelected
OnClientTabUnSelected tabUnSelected add_tabUnSelected, remove_tabUnSelected
OnClientTabSelecting tabSelecting add_tabSelecting, remove_tabSelecting

Enabling and disabling events

If you want for some reason to temporarily "mute" the control event emitting (or, respectively, to "unmute" the events again), you may use the disableEvents() and enableEvents() methods. Unlike adding and removing individual event handlers, enableEvents() and disableEvents() affect all events at once.

See Also

In this article