這篇文章主要為大家展示了“AjaxToolKit之Rating控件怎么用”，內(nèi)容簡(jiǎn)而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“AjaxToolKit之Rating控件怎么用”這篇文章吧。

烏翠網(wǎng)站制作公司哪家好，找創(chuàng)新互聯(lián)！從網(wǎng)頁(yè)設(shè)計(jì)、網(wǎng)站建設(shè)、微信開發(fā)、APP開發(fā)、成都響應(yīng)式網(wǎng)站建設(shè)公司等網(wǎng)站項(xiàng)目制作，到程序開發(fā)，運(yùn)營(yíng)維護(hù)。創(chuàng)新互聯(lián)從2013年開始到現(xiàn)在10年的時(shí)間，我們擁有了豐富的建站經(jīng)驗(yàn)和運(yùn)維經(jīng)驗(yàn)，來(lái)保證我們的工作的順利進(jìn)行。專注于網(wǎng)站建設(shè)就選創(chuàng)新互聯(lián)。

AjaxToolKit中的Rating控件是微軟Ajax控件庫(kù)中專門用來(lái)處理網(wǎng)頁(yè)評(píng)分（或投票）功能的控件，它本身支持網(wǎng)頁(yè)無(wú)刷新功能，在使用的時(shí)候完全沒(méi)有必要將它放在UpdatePanel控件里，而只需要將它的AutoPostBack屬性設(shè)為False即可。該控件使用起來(lái)非常簡(jiǎn)單，而且還可以設(shè)置各種不同的效果，以及自定義函數(shù)回調(diào)等。下面是使用時(shí)候的一個(gè)截圖

先說(shuō)一下常用屬性的功能：
 ID：這個(gè)自然不用說(shuō)了，大家都明白，所有的控件都會(huì)有一個(gè)服務(wù)器端的ID。 
BehaviorID：通過(guò)Ajax客戶端獲取控件對(duì)象時(shí)所要使用的ID，這個(gè)在設(shè)置回調(diào)函數(shù)時(shí)通過(guò)$Find方法進(jìn)行查找。
MaxRating：控件當(dāng)前最大值。該值在UI上直接反映了“星形”圖標(biāo)的個(gè)數(shù)。 
CurrentRating：當(dāng)前值，即控件當(dāng)前所顯示的值。該值在UI上直接反映了被點(diǎn)亮的“星形”圖標(biāo)的數(shù)量。注意該值的范圍在0-MaxRating之間（包括0和MaxRating）。 
runat：注冊(cè)控件為服務(wù)器端行為，必須設(shè)置該值。 
StarCssClass：“星形”圖標(biāo)的樣式。必須指定。
 WaitingStarCssClass：當(dāng)處理客戶端響應(yīng)時(shí)，控件與服務(wù)器進(jìn)行交互期間處于等待狀態(tài)時(shí)“星形”圖標(biāo)的樣式。必須指定。
FilledStarCssClass：當(dāng)“星形”圖標(biāo)被點(diǎn)亮?xí)r的樣式。必須指定。 
EmptyStarCssClass：當(dāng)“星形”圖標(biāo)未被點(diǎn)亮?xí)r的樣式。必須指定。 
CssClass：Rating控件的整體樣式。需要時(shí)指定。 
OnChanged：用于處理用戶點(diǎn)擊“星形”圖標(biāo)后的響應(yīng)事件。該事件在服務(wù)器端處理。 
AutoPostBack：設(shè)置控件是否自動(dòng)回傳。一般情況下設(shè)置該值為False。 
ReadOnly：控件的只讀狀態(tài)，處于只讀狀態(tài)下的Rating不能被用戶點(diǎn)擊，可以為只讀狀態(tài)的Rating設(shè)置單獨(dú)的樣式。
下面來(lái)看看如何使用。 
準(zhǔn)備工作： 
1. 確保工程中正確引用了AjaxControlToolkit.dll程序集。該程序集在Visual Studio2005中為beta版本，需要自己去微軟的官方網(wǎng)站下載安裝包，Visual Studio2008中已經(jīng)隨IDE自動(dòng)安裝了，可以直接使用。 
2. 在Visual Studio2008中，該控件沒(méi)有被自動(dòng)添加到工具箱中，需要手動(dòng)添加到工具箱，然后拖放到頁(yè)面上。你可以在Visual Studio中打開工具箱浮動(dòng)面板，選擇一個(gè)空白的Tab（如General Tab），點(diǎn)擊右鍵，選擇“選擇項(xiàng)…”，在彈出的對(duì)話框中找到AjaxControlToolkit程序集中相應(yīng)的控件，如下圖。

3. 注意，如果你在上述對(duì)話框中沒(méi)有找到有關(guān)AjaxControlToolkit的控件，則需要自己指定AjaxControlToolkit.dll程序集的路徑。讀者如果沒(méi)有找到該文件的話這里方便給大家提供一個(gè)下載。
 AjaxControlToolkit.dll 
4. 添加好控件后，在工具箱中就可以像標(biāo)準(zhǔn)的ASP.NET控件一樣使用Rating控件了。

準(zhǔn)備工作做好之后，在工程中新建一個(gè)Web頁(yè)面，將控件放到頁(yè)面上，注意所有的Ajax控件都需要ScriptManager控件的支持，該控件負(fù)責(zé)在客戶端注冊(cè)必要的腳本。所以在添加Rating控件之前，先確保頁(yè)面上有且僅有一個(gè)ScriptManager控件。下面是aspx文件的代碼示例。

<%@ 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" %> 
 
 
 
  
  
 
 
  
 
 
  
  
  
  

  
   Sys.Application.add_load( 
   function() { 
    $find("RatingRate1").add_EndClientCallback( 
    function(sender, e) { 
     var result = e.get_CallbackResult(); 
     alert(result); 
    } 
    ); 
   } 
   ); 
  

 
 
  
 

Rating控件的相關(guān)屬性和事件都已經(jīng)添加了，這里說(shuō)一下腳本的含義。通過(guò)Sys.Application.add_load方法在頁(yè)面全部加載完成后給Rating控件注冊(cè)一個(gè)回調(diào)方法，通過(guò)$find(“RatingRate1”).add_EndClientCallback方法進(jìn)行注冊(cè)，用于接收服務(wù)端傳遞回來(lái)的值。這些腳本都是標(biāo)準(zhǔn)的Ajax框架提供的，這里就不做太多解釋了，讀者可以去查閱微軟的MSDN，上面有很詳細(xì)的介紹。

接下來(lái)是cs文件的代碼。 

protected void RatingRate_Changed(object sender, AjaxControlToolkit.RatingEventArgs e) 
{ 
 System.Threading.Thread.Sleep(300); 
 //TODO: Save e.Value to database. 
 e.CallbackResult = "success"; 
}

很簡(jiǎn)單，首先讓線程停止300ms，這樣我們可以有時(shí)間看到處于等待狀態(tài)的Rating控件的樣式。然后可以去處理數(shù)據(jù)保存（例如將Rating的當(dāng)前值保存到數(shù)據(jù)庫(kù)等），注意用戶所選的值是通過(guò)e.Value屬性得到的，該屬性為字符串類型。然后通過(guò)e.CallbackResult屬性傳遞一個(gè)回調(diào)值到客戶端，客戶端得到該值后進(jìn)行相應(yīng)的處理。

下面順便給出css樣式和示例圖片下載，讀者可以自己去嘗試一下！注意Rating的當(dāng)前值是不能被用戶點(diǎn)擊的，如初始化時(shí)Rating的CurrentRating值為3，則用戶點(diǎn)擊第三個(gè)“星形”圖標(biāo)則不會(huì)觸發(fā)點(diǎn)擊事件，另外就是Rating可以被用戶反復(fù)點(diǎn)擊，你可以在服務(wù)端進(jìn)行處理，如當(dāng)用戶點(diǎn)擊之后將控件設(shè)為只讀狀態(tài)等。 

.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); 
}

以下是運(yùn)行時(shí)的效果：

以上是“AjaxToolKit之Rating控件怎么用”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！