Ajaxtoolkit rating control using methods _ajax related

The rating control in Ajaxtoolkit is a control that is specifically used in the Microsoft Ajax Control Library to handle web page scoring (or voting) functions, which itself supports no refresh of the Web page, and it is not necessary to place it in the UpdatePanel control when used. Instead, simply set its AutoPostBack property to False. The control is simple to use and can also set various effects, as well as custom function callbacks, and so on. Here's a screenshot of when to use

First of all, the functions of common properties:
ID:Needless to say, everyone knows that all controls will have a server-side ID.
Behaviorid:The ID to use when obtaining the control object through the AJAX client, which is searched by 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, which is the value currently displayed by the control. This value directly reflects the number of "star" icons that are lit on the UI. Note that the range of values is between 0-maxrating (including 0 and maxrating).
runat:Registering a control as a server-side behavior, you must set this value.
starcssclass: "The style of the star icon. Must be specified.
Waitingstarcssclass:The style of the star icon when the control interacts with the server while it is in the waiting state while processing the client response. 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:Rating the overall style of the control. specified when required.
onchanged:Used to handle response events after the user clicks on the "Star" icon. The event is processed on the server side.
AutoPostBack:Sets whether the control is automatically returned. In general, set this value to False.
ReadOnly:The read-only state of the control, the rating in read-only state cannot be clicked by the user, and a separate style can be set for the rating of the read-only state.
Let's look at how to use it.
Preparatory work:
1. Ensure that the AjaxControlToolkit.dll assembly is correctly referenced in the project. The assembly, which is beta in visual Studio2005, needs to download the installation package from Microsoft's official website, which has been automatically installed with the IDE in Visual Studio2008 and can be used directly.
2. In visual Studio2008, the control is not automatically added to the toolbox, it needs to be added to the toolbox manually, and then dragged and dropped onto the page. You can open the Toolbox floating panel in Visual Studio, select a blank tab (such as General tab), right-click, select "Select Item ...", and find the corresponding control in the AjaxControlToolkit assembly in the pop-up dialog box ., as shown below.

3. Note that if you do not find a control on AjaxControlToolkit in the above dialog box, you will need to specify the path to the AjaxControlToolkit.dll assembly yourself. If the reader does not find the file, it is convenient for you to provide a download.
AjaxControlToolkit.dll
4. After you add a good control, you can use the rating control like a standard asp.net control in the toolbox.

After the preparation is done, create a new Web page in the project, place the controls on the page, and note that all AJAX controls require the support of the ScriptManager control, which is responsible for registering the necessary scripts on the client. So before adding the rating control, make sure there is only one ScriptManager control on the page. The following is a code example for an 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 ">  

The associated properties and events for the rating control have been added, and here's what the script means. Registers a callback method with the rating control through the $find ("RatingRate1") after all the pages have been loaded, using the Sys.Application.add_load method. Used to receive the value that the service side passes back. These scripts are provided by the standard AJAX framework, and there is no explanation for this, and readers can check out Microsoft MSDN for a detailed description.

Next is the code for the CS file.

protected void Ratingrate_changed (object sender, Ajaxcontroltoolkit.ratingeventargs e) 
{ 
 System.Threading.Thread.Sleep (); 
 Todo:save e.value to database. 
 E.callbackresult = "Success"; 
}

Very simply, let the thread stop 300ms first so we can have time to see the style of the rating control in the waiting state. You can then process the data save (for example, save the current value of rating to a database, and so on), and note that the user's chosen value is through E. Value property, which is a string type. And then through E. The Callbackresult property passes a callback value to the client, which is processed after the client obtains the value.

Below the incidentally gives the CSS style and the example picture downloading, the reader may go to try for oneself! Note that the current value of rating can not be clicked by the user, such as the initialization of the rating currentrating value of 3, then the user clicks the third "star" icon will not trigger the Click event, the other is rating can be repeatedly clicked by users, you can handle in the service side, such as when the user clicks to set the control to read-only state.

. 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 are the effects of the runtime:

The above is the entire content of this article, I hope to help you learn, but also hope that we support the cloud habitat community.