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

Rating / Client-Side Events



Set RadRating Selected Value:
 

RadRating:
Clear log Event log:

  • Client-Side Functionality


    This example demonstrates the client-side functionality of the RadRating control.

    See the help section for detailed information about RadRating's client-side events and API.

    Client-side events:

    • OnClientLoad - raised when the Rating control is initialized.
    • OnClientRating - raised when the user is rating and before the new value is set to the control.
    • OnClientRated - raised after the user has rated.

Source Code

C# VB.NET
Show code in new window Demo isolation steps
  • <%@ Page Language="c#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.Rating.ClientSideFunctionality.DefaultCS"
        CodeFile="DefaultCS.aspx.cs" %>

    <%@ 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">
        <title></title>
        <qsf:HeadTag ID="Headtag1" runat="server" />
        <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
            <style type="text/css">
                .module1
                {
                    background-color: #dff3ff;
                    border: 1px solid #c6e1f2;
                    padding: 15px 0 15px 0;
                }
            </style>

            <script type="text/javascript">
            //<![CDATA[
                function GetRatingObject()
                {
                    return $find("<%=RadRating1.ClientID %>");
                }

                function SetReadOnly()
                {
                    var oRating = GetRatingObject();
                    oRating.set_readOnly(!oRating.get_readOnly());
                }

                function SetValue()
                {
                    var oRating = GetRatingObject();
                    var value = parseFloat($get("txtValue").value);
                    if (isNaN(value))
                    {
                        alert("Please enter a numeric value.");
                        $get("txtValue").value = oRating.get_value();
                        return;
                    }

                    if (value >= 0 && value <= 7)
                    {
                        oRating.set_value(value);
                    }
                    else
                    {
                        alert("Please enter a value within 0-7.");
                    }

                }

                //Events
                function OnClientLoad(sender)
                {
                    logEvent("RadRating with ID: " + sender.get_id() + " is loaded. Initial value is [" + sender.get_value() + "]");
                }
                function OnClientRating(sender, args)
                {
                    var isCancelled = $get("cbCancel").checked;
                    if (isCancelled)
                    {
                        logEvent("You have canceled the OnClientRating event. The rating will not occur.");
                        args.set_cancel(isCancelled);
                    }
                    else
                    {
                        logEvent("ClientRating event fired.");
                    }
                }
                function OnClientRated(sender, args)
                {
                    logEvent("ClientRated event fired.");
                }
                //]]>
            </script>

        </telerik:RadScriptBlock>
    </head>
    <body class="BODY">
        <form id="Form2" method="post" runat="server">
        <qsf:Header ID="Header1" runat="server" NavigationLanguage="c#" ShowSkinChooser="true" />
        <telerik:RadScriptManager ID="ScriptManager" runat="server" />
        <telerik:RadFormDecorator ID="RFD1" runat="server" DecoratedControls="All" />
        <fieldset class="module1">
            <div style="float: left; padding-left: 50px;">
                <asp:CheckBox ID="cbCancel" runat="server" Text="Cancel OnClientRating (If checked the rating does not occur.)" />
                <br />
                <br />
                <asp:CheckBox ID="cbReadOnly" runat="server" onclick="SetReadOnly();" Text="Make RadRating ReadOnly" />
            </div>
            <div style="float: left; padding-left: 120px; color: #000;">
                <span style="line-height: 250%;">Set RadRating Selected Value:</span><br />
                <asp:TextBox ID="txtValue" runat="server" Style="width: 40px"></asp:TextBox>&nbsp;
    <asp:Button ID="btnValue" runat="server" OnClientClick="SetValue();return false;"
    Text="Set" />
            </div>
        </fieldset>
        <br />
        <div style="padding-left: 300px; border: 1px solid rgb(204, 204, 204);">
            <span style="line-height: 250%;">RadRating:</span>
            <telerik:RadRating ID="RadRating1" runat="server" Precision="Exact" SelectionMode="Continuous"
                OnClientLoad="OnClientLoad" OnClientRating="OnClientRating" OnClientRated="OnClientRated"
                ItemCount="7" />
            <br />
        </div>
        <qsf:EventLogConsole ID="EventLogConsole1" runat="server" AllowClear="true" />
        <qsf:Footer runat="server" ID="Footer1" ShowCodeViewer="true" />
        </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