New to Telerik UI for ASP.NET AJAXStart a free 30-day trial

Events Overview

RadToolBar supports a number of client-side events that let you customize the behavior of the toolbar:

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 RadToolBar property.

ASPNET
<script>
    function OnClientButtonClicking(sender, args) {
        args.set_cancel(true);    
    }
</script>

<telerik:RadToolBar RenderMode="Lightweight" 
	ID="RadToolBar1" 
	runat="server" 
	Orientation="Horizontal" 
	OnClientButtonClicking="OnClientButtonClicking">
    <CollapseAnimation Duration="200" Type="OutQuint" />
    <Items>
        <telerik:RadToolBarButton Text="button1" runat="server">
        </telerik:RadToolBarButton>
        <telerik:RadToolBarDropDown Text="dropdown" runat="server">
            <Buttons>
                <telerik:RadToolBarButton Text="Button2" runat="server">
                </telerik:RadToolBarButton>
            </Buttons>
        </telerik:RadToolBarDropDown>
    </Items>
</telerik:RadToolBar>	    

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:

JavaScript
function onClickedHandler1() {
    alert("First handler called");
}
function onClickedHandler2() {
    alert("Second handler called");
}
function pageLoad() {
    var toolBar = $find("<%=RadToolBar1.ClientID%>");
    
    toolBar.add_buttonClicked(OnClickedHandler1);
    toolBar.add_buttonClicked(OnClickedHandler2);
}				

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

JavaScript
function removeOnClicked2() {
    var toolBar = $find("<%=RadToolBar1.ClientID%>");
    toolBar.remove_buttonClicked(onClickedHandler1);
}

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

Server-Side NameClient-SideNameMethods to add and Remove
OnClientLoadloadadd_load, remove_load
OnClientButtonClickingbuttonClickingadd_buttonClicking, remove_buttonClicking
OnClientButtonClickedbuttonClickedadd_buttonClicked, remove_buttonClicked
OnClientDropDownCloseddropDownClosedadd_dropDownClosed, remove_dropDownClosed
OnClientDropDownClosingdropDownClosingadd_dropDownClosing, remove_dropDownClosing
OnClientDropDownOpeneddropDownOpenedadd_dropDownOpened, remove_dropDownOpened
OnClientDropDownOpeningdropDownOpeningadd_dropDownOpening, remove_dropDownOpening
OnClientCheckedStateChangedcheckedStateChangedadd_checkedStateChanged, remove_checkStateChanged
OnClientCheckedStateChangingcheckedStateChangingadd_checkedStateChanging, remove_checkStateChanging
OnClientContextMenucontextMenuadd_contextMenu, remove_contextMenu
OnClientMouseOvermouseOveradd_mouseOver, remove_mouseOver
OnClientMouseOutmouseOutadd_mouseOut, remove_mouseOut

See Also

In this article
See Also
Not finding the help you need?
Contact Support