AjaxToolKit怎么使用Rating控件
这次给大家带来AjaxToolKit怎么使用Rating控件，AjaxToolKit使用Rating控件的注意事项有哪些，下面就是实战案例，一起来看一下。
AjaxToolKit中的Rating控件是微软Ajax控件库中专门用来处理网页评分（或投票）功能的控件，它本身支持网页无刷新功能，在使用的时候完全没有必要将它放在UpdatePanel控件里，而只需要将它的AutoPostBack属性设为False即可。该控件使用起来非常简单，而且还可以设置各种不同的效果，以及自定义函数回调等。下面是使用时候的一个截图
先说一下常用属性的功能：
ID：这个自然不用说了，大家都明白，所有的控件都会有一个服务器端的ID。
BehaviorID：通过Ajax客户端获取控件对象时所要使用的ID，这个在设置回调函数时通过$Find方法进行查找。
MaxRating：控件当前最大值。该值在UI上直接反映了“星形”图标的个数。
CurrentRating：当前值，即控件当前所显示的值。该值在UI上直接反映了被点亮的“星形”图标的数量。注意该值的范围在0-MaxRating之间（包括0和MaxRating）。
runat：注册控件为服务器端行为，必须设置该值。
StarCssClass：“星形”图标的样式。必须指定。
WaitingStarCssClass：当处理客户端响应时，控件与服务器进行交互期间处于等待状态时“星形”图标的样式。必须指定。
FilledStarCssClass：当“星形”图标被点亮时的样式。必须指定。
EmptyStarCssClass：当“星形”图标未被点亮时的样式。必须指定。
CssClass：Rating控件的整体样式。需要时指定。
OnChanged：用于处理用户点击“星形”图标后的响应事件。该事件在服务器端处理。
AutoPostBack：设置控件是否自动回传。一般情况下设置该值为False。
ReadOnly：控件的只读状态，处于只读状态下的Rating不能被用户点击，可以为只读状态的Rating设置单独的样式。
下面来看看如何使用。
准备工作：
1. 确保工程中正确引用了AjaxControlToolkit.dll程序集。该程序集在Visual Studio2005中为beta版本，需要自己去微软的官方网站下载安装包，Visual Studio2008中已经随IDE自动安装了，可以直接使用。
2. 在Visual Studio2008中，该控件没有被自动添加到工具箱中，需要手动添加到工具箱，然后拖放到页面上。你可以在Visual Studio中打开工具箱浮动面板，选择一个空白的Tab（如General Tab），点击右键，选择“选择项…”，在弹出的对话框中找到AjaxControlToolkit程序集中相应的控件，如下图。
3. 注意，如果你在上述对话框中没有找到有关AjaxControlToolkit的控件，则需要自己指定AjaxControlToolkit.dll程序集的路径。读者如果没有找到该文件的话这里方便给大家提供一个下载。 AjaxControlToolkit.dll 4. 添加好控件后，在工具箱中就可以像标准的ASP.NET控件一样使用Rating控件了。
准备工作做好之后，在工程中新建一个Web页面，将控件放到页面上，注意所有的Ajax控件都需要ScriptManager控件的支持，该控件负责在客户端注册必要的脚本。所以在添加Rating控件之前，先确保页面上有且仅有一个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" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<p>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<ajaxToolkit:Rating ID="RatingRate" BehaviorID="RatingRate1" MaxRating="5" CurrentRating="3"
runat="server" StarCssClass="ratingStar" WaitingStarCssClass="waitingRatingStar"
FilledStarCssClass="filledRatingStar" EmptyStarCssClass="emptyRatingStar"
OnChanged="RatingRate_Changed" AutoPostBack="false">
</ajaxToolkit:Rating>
<script type="text/javascript">
Sys.Application.add_load(
function() {
$find("RatingRate1").add_EndClientCallback(
function(sender, e) {
var result = e.get_CallbackResult();
alert(result);
}
);
}
);
</script>
</p>
</form>
</body>
</html>Rating控件的相关属性和事件都已经添加了，这里说一下脚本的含义。通过Sys.Application.add_load方法在页面全部加载完成后给Rating控件注册一个回调方法，通过$find(“RatingRate1”).add_EndClientCallback方法进行注册，用于接收服务端传递回来的值。这些脚本都是标准的Ajax框架提供的，这里就不做太多解释了，读者可以去查阅微软的MSDN，上面有很详细的介绍。
接下来是cs文件的代码。
protected void RatingRate_Changed(object sender, AjaxControlToolkit.RatingEventArgs e)
{
System.Threading.Thread.Sleep(300);
//TODO: Save e.Value to database.
e.CallbackResult = "success";
}很简单，首先让线程停止300ms，这样我们可以有时间看到处于等待状态的Rating控件的样式。然后可以去处理数据保存（例如将Rating的当前值保存到数据库等），注意用户所选的值是通过e.Value属性得到的，该属性为字符串类型。然后通过e.CallbackResult属性传递一个回调值到客户端，客户端得到该值后进行相应的处理。
下面顺便给出css样式和示例图片下载，读者可以自己去尝试一下！注意Rating的当前值是不能被用户点击的，如初始化时Rating的CurrentRating值为3，则用户点击第三个“星形”图标则不会触发点击事件，另外就是Rating可以被用户反复点击，你可以在服务端进行处理，如当用户点击之后将控件设为只读状态等。
.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);
}以下是运行时的效果：
相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！
推荐阅读：
以上是AjaxToolKit怎么使用Rating控件的详细内容。更多信息请关注PHP中文网其他相关文章！
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸！
热门文章
热工具
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3汉化版
中文版，非常好用
禅工作室 13.0.1
功能强大的PHP集成开发环境
Dreamweaver CS6
视觉化网页开发工具
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
热门话题
Go语言Web开发框架中常见的富文本编辑器控件
Jun 04, 2023 am 09:10 AM
随着Web应用程序的普及，富文本编辑器成为Web开发中必不可少的一个工具。而在使用Go语言进行Web开发时，我们也需要选择一个适合的富文本编辑器控件来丰富我们的网站和应用程序。在本文中，我们将会探讨Go语言Web开发常见的富文本编辑器控件。FroalaEditorFroalaEditor是一款流行的富文本编辑器控件，被广泛应用于Web开发中。它具有现代化
panel控件怎么用
Oct 10, 2023 am 09:36 AM
panel控件的使用步骤是首先创建了一个Panel控件，并设置了其宽度、高度、背景颜色、边框颜色、边框宽度和内边距，创建了两个按钮，并将它们添加到Panel控件中，最后将Panel控件添加到窗体中。
excel控件怎么制作
Mar 20, 2024 am 09:40 AM
我们在使用excel办公软件的时候，如果能够巧妙地使用一些控件，可以帮助我们在excel表格中做出比较专业的效果，比如添加选择控件，可以使填表人员轻松的完成表格的填写。下边，我们就演示excel选择控件的制作方法，希望对你有帮助！1、首先，我们新建并打开一个空白的excel表格。2、添加“开发工具”选项卡，点击左上侧文件按钮，找到“Excel选项”，之后，我们在自定义功能区的选项内找到开发工具，勾选，使其前边出现对号就可以。3、回到excel工作界面，就可以看到“开发工具”选项卡了，一般情况，不
常见的Ajax控件有哪些？深入了解其特点和功能
Jan 17, 2024 am 11:11 AM
深入了解Ajax控件：常见的有哪些？介绍：在现代Web开发中，Ajax（AsynchronousJavaScriptandXML）成为了一种流行的技术，它可以实现网页局部刷新，提升用户体验。而在开发中，我们通常使用Ajax控件来简化和加速我们的开发流程。本文将深入了解Ajax控件，介绍一些常见的控件及其功能。一、jQueryAjax：jQueryA
揭秘必备的Web标准控件：深入解析界面元素
Jan 13, 2024 pm 12:19 PM
Web标准控件大揭秘：必备的界面元素解析导语：Web标准控件是网页设计中不可或缺的一部分，它们为用户提供了丰富的交互体验和友好的界面，具有重要的作用。本文将揭秘几种必备的Web标准控件，为读者解析它们的功能和使用方法。一、按钮控件按钮控件是Web界面设计中最常见、最基础的元素之一，用于触发某种操作。它通常具有以下几个属性：文本内容：按钮上显示的文本信息。样式
控件是什么
Oct 28, 2022 pm 03:51 PM
控件是指对数据和方法的封装；控件可以有自己的属性和方法，其中属性是控件数据的简单访问者，方法则是控件的一些简单而可见的功能、控件创建过程包括设计、开发、调试；创建控件的最大意义在于封装重复的工作，其次是可以扩充现有控件的功能。
了解最受欢迎的Ajax控件！
Jan 17, 2024 am 09:47 AM
在Web开发中，Ajax技术可以让网页与服务器进行异步通信，大大提高网页的响应速度和用户体验。而Ajax控件则是在此基础上开发出来的一类工具，可以帮助我们更加方便地实现各种功能，提高开发效率。本文将对一些比较常用的Ajax控件进行介绍和分析。一、jQueryjQuery是目前最流行的Javascript库，它的Ajax支持非常强大，使用起来也比较简单。通过慕
解决edge浏览器无法安装office控件的方法
Jan 06, 2024 pm 05:01 PM
办公的小伙伴们要在oa上查看公告文件就需要在浏览器上安装office控件，但是很多用户在安装的时候都失败了，其实是因为没有进行设置，下面就一起来看看具体的方法吧。edge浏览器office控件安装不了：1、进入edge浏览器—>设置—>更多工具—>Internet选项。2、点击“隐私”，将“启用弹出窗口阻止程序”的√取消。3、在“安全”中添加信任站点，把OA的地址添加进可信任的站点。4、在“安全”任务栏中点击“自定义级别”。5、在“ActiveX控件和插件”中，将所有项设置为“启用”。6
