How to Use the Rating control of AjaxToolKit, ajaxtoolkitrating
The Rating control in AjaxToolKit is a control specifically used by the Microsoft Ajax control library to process the web page Rating (or vote) function. It supports the new features of no Refreshing Web pages, you do not need to put it in the UpdatePanel control when using it. Instead, you only need to set its AutoPostBack attribute to False. This control is very easy to use, and can also set different effects, as well as custom function callback. Below is
Let's talk about the features of common attributes:
ID:Needless to say, everyone understands that all controls have a server ID.
BehaviorID:The ID used to obtain the control object through the Ajax client, which is searched through the $ Find method when setting the callback function.
MaxRating:The current maximum value of the control. This value directly reflects the number of "star" icons on the UI.
CurrentRating:The current value, that is, the value currently displayed by the control. This value directly reflects the number of star icons on the UI. Note that the value range is between 0 and MaxRating (including 0 and MaxRating ).
Runat:This value must be set when the registration control is a server-side action.
StarCssClass:"The style of the star icon. Must be specified.
WaitingStarCssClass:The style of the "star" icon when the control is in the waiting state during interaction with the server when the client responds. Must be specified.
FilledStarCssClass:The style when the star icon is lit. Must be specified.
EmptyStarCssClass:The style when the star icon is not lit. Must be specified.
CssClass:The overall style of the Rating control. Required.
OnChanged:It is used to process the response events after a user clicks the "star" icon. This event is handled on the server.
AutoPostBack:Sets whether the control is automatically returned. Set this value to False.
ReadOnly:Controls are read-only. Rating in read-only status cannot be clicked by users. You can set a separate style for read-only Rating.
Next let's take a look at how to use it.
Preparations:
1. Make sure that the AjaxControlToolkit. dll assembly is correctly referenced in the project. This Assembly is beta in Visual Studio2005. You need to download the installation package from Microsoft's official website. Visual Studio2008 has been automatically installed with IDE and can be directly used.
2. In Visual Studio2008, the control is not automatically added to the toolbox. You need to manually add it to the toolbox and drag and drop it to the page. You can open the floating Panel of the toolbox in Visual Studio, select a blank Tab (such as the General Tab), right-click it, and select "select item ...", In the displayed dialog box, find the corresponding control in the AjaxControlToolkit assembly., Such.
3. Note: if you do not find the AjaxControlToolkit control in the preceding dialog box, you must specify the path of the AjaxControlToolkit. dll assembly. If this file is not found, you can download it easily.
AjaxControlToolkit. dll
4. After adding the control, you can use the Rating control like the standard ASP. NET control in the toolbox.
After the preparation is complete, create a new Web page in the project and place the control on the page. Note that all Ajax controls require the support of the ScriptManager control, this control registers necessary scripts on the client. Therefore, before adding the Rating control, ensure that there is only one ScriptManager control on the page. The following is a sample code for the aspx file.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="iFrameUpload.WebForm1" %> <%@ Register Assembly="AjaxControlToolkit, Version=3.0.20820.0, Culture=neutral, PublicKeyToken=28f01b0e84b6d53e" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolkit" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">Attributes and events of the Rating control have been added. The meaning of the script is described here. Through Sys. application. after all the pages are loaded, the add_load method registers a callback method for the Rating control through $ find ("RatingRate1 "). the add_EndClientCallback method is used to receive the value passed back by the server. These scripts are provided by the standard Ajax framework. I will not explain them much here. You can refer to Microsoft's MSDN for a detailed introduction.
The following is the cs file code.
protected void RatingRate_Changed(object sender, AjaxControlToolkit.RatingEventArgs e) { System.Threading.Thread.Sleep(300); //TODO: Save e.Value to database. e.CallbackResult = "success"; }First, let the thread stop for 300 ms, so that we can have time to see the pattern of the Rating control in the waiting state. You can then save the processed data (for example, save the current Value of Rating to the database). Note that the Value selected by the user is obtained through the e. Value Attribute, which is of the string type. Then, a callback value is passed to the client through the e. CallbackResult attribute. The client obtains the value and processes it accordingly.
The following provides css styles and sample image downloads. You can try them on your own! Note that the current value of Rating cannot be clicked by users. For example, if the value of CurrentRating in Rating is 3 during initialization, clicking the third "star" icon does not trigger a click event, in addition, Rating can be repeatedly clicked by users, and you can perform processing on the server, such as setting the control to read-only after clicking.
.ratingStar { font-size: 0pt; width: 13px; height: 12px; margin: 0px; padding: 0px; cursor: pointer; display: block; background-repeat: no-repeat; } .waitingRatingStar /*normal mode empty style*/ { background-image: url(Rating_default.gif); } .filledRatingStar /*normal mode filled style*/ { background-image: url(Rating_normal.gif); } .emptyRatingStar /*readonly mode empty style*/ { background-image: url(Rating_empty.gif); }The following figure shows the running effect:
The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
