Telerik is a leading vendor of ASP.NET AJAX, ASP.NET MVC, Silverlight, WinForms and WPF controls and components, as well as .NET Reporting, .NET ORM , .NET CMS, Code Analysis, Mocking, Team Productivity and Automated Testing Tools. Building on its expertise in interface development and Microsoft technologies, Telerik helps customers build applications with unparalleled richness, responsiveness and interactivity. Telerik products help thousands of companies to be more productive and deliver reliable applications under budget and on time.
Version Q2 2011 released 07/12/2011
select

Button / Client-side Events

CheckBox Button
ToggleButton: Mute
Clear log Event log:

  • Client-Side Events

    RadButton exposes several client-side events which allow easy and flexible use in a wide range of application scenarios:

    • OnClientLoad - raised when the control is initialized.
    • OnClientClicking - raised when the user clicks the button. The event can be canceled.
    • OnClientClicked - raised when the button is clicked. The event is subsequent to the OnClientClicking event.
    • OnClientMouseOver - raised when the mouse hovers over the control.
    • OnClientMouseOut - raised when the mouse leaves the control.
    • OnClientCheckedChanging - raised when the Checked property of the RadButton control is about to be changed. The event can be canceled. 
    • OnClientCheckedChanged - raised after the Checked property of the RadButton control is changed.
    • OnClientToggleStateChanging - raised the SelectedToggleStateIndex property of the RadButton control is about to be changed. The event can be canceled.
    • OnClientToggleStateChanged - raised after the SelectedToggleStateIndex property of the RadButton control is changed.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="C#" AutoEventWireup="true" %>

    <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
    <%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
    <%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %>
    <%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %>
    <!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 runat="server">
        <qsf:HeadTag ID="Headtag1" runat="server" />
    </head>
    <body class="BODY">
        <form id="form1" runat="server">
        <qsf:Header ID="Header1" runat="server" NavigationLanguage="c#" />
        <telerik:RadScriptManager ID="ScriptManager1" runat="server" />
        <script type="text/javascript">
            //<![CDATA[
            function OnClientLoad(sender, eventArgs) {
                logEvent("Load event: <strong>" + sender.get_text() + "</strong> is loaded.");
                sender.set_autoPostBack(false);
            }

            function OnClientClicking(sender, eventArgs) {
                logEvent("Clicking event: <strong>" + sender.get_text() + "</strong> fired clicking.");
            }

            function OnClientClicked(sender, eventArgs) {
                logEvent("Clicked event: <strong>" + sender.get_text() + "</strong> was clicked.");
            }

            function OnClientMouseOver(sender, eventArgs) {
                logEvent("MouseOver event: The mouse is over <strong>" + sender.get_text() + "</strong>.");
            }

            function OnClientMouseOut(sender, eventArgs) {
                logEvent("MouseOut event: The mouse has left <strong>" + sender.get_text() + "</strong>.");
            }

            function OnClientCheckedChanging(sender, eventArgs) {
                var checked = (sender.get_checked()) ? "checked" : "unchecked";
                logEvent("CheckedChanging event: The <strong>" + sender.get_text() + "</strong> is " + checked + ".");
            }

            function OnClientCheckedChanged(sender, eventArgs) {
                var checked = (sender.get_checked()) ? "checked" : "unchecked";
                logEvent("CheckedChanged event: The <strong>" + sender.get_text() + "</strong> is " + checked + ".");
            }

            function OnClientToggleStateChanging(sender, eventArgs) {
                logEvent("ToggleStateChanging event: <strong>" + sender.get_text() + "</strong> SelectedToggleStateIndex: " + sender.get_selectedToggleStateIndex());
            }

            function OnClientToggleStateChanged(sender, eventArgs) {
                logEvent("ToggleStateChanged event: <strong>" + sender.get_text() + "</strong> SelectedToggleStateIndex: " + sender.get_selectedToggleStateIndex());
            }
            
            //]]>
        </script>

        <telerik:RadButton ID="btnStandard" runat="server" Text="Standard Button"
            OnClientLoad="OnClientLoad"
            OnClientClicking="OnClientClicking"
            OnClientClicked="OnClientClicked"
            OnClientMouseOver="OnClientMouseOver"
            OnClientMouseOut="OnClientMouseOut"
        ></telerik:RadButton>
        <div style="padding: 5px"></div>
        <telerik:RadButton ID="btnCheckBox" runat="server" ButtonType="ToggleButton" ToggleType="CheckBox" Text="CheckBox Button"
                OnClientLoad="OnClientLoad"
                OnClientClicking="OnClientClicking"
                OnClientClicked="OnClientClicked"
                OnClientMouseOver="OnClientMouseOver"
                OnClientMouseOut="OnClientMouseOut"
                OnClientCheckedChanging="OnClientCheckedChanging"
                OnClientCheckedChanged="OnClientCheckedChanged"
        ></telerik:RadButton>
        <div style="padding: 5px"></div>
        <telerik:RadButton ID="RadButton1" runat="server" ButtonType="LinkButton" ToggleType="CustomToggle" Text="CustomToggle Button"
                OnClientLoad="OnClientLoad"
                OnClientClicking="OnClientClicking"
                OnClientClicked="OnClientClicked"
                OnClientMouseOver="OnClientMouseOver"
                OnClientMouseOut="OnClientMouseOut"
                OnClientToggleStateChanging="OnClientToggleStateChanging"
                OnClientToggleStateChanged="OnClientToggleStateChanged">
            <ToggleStates>
                <telerik:RadButtonToggleState Text="ToggleButton: Mute" />
                <telerik:RadButtonToggleState Text="ToggleButton: Low" />
                <telerik:RadButtonToggleState Text="ToggleButton: Medium" />
                <telerik:RadButtonToggleState Text="ToggleButton: High" />
            </ToggleStates>
        </telerik:RadButton>
                            
        <qsf:EventLogConsole ID="EventLogConsole1" runat="server" AllowClear="true" Height="300px" />
        <qsf:Footer runat="server" ID="Footer1" />
        </form>
    </body>
    </html>

Get more than expected!

 
 

Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.

Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.

If you have any questions, do not hesitate to contact us at sales@telerik.com.

Copyright 2002-2024 © Telerik. All right reserved
Telerik Inc, 201 Jones Rd, Waltham, MA 02451