作者在 2008-05-04 18:05:45 发布以下内容
控件名:Rating
用途和效果:一种全新的等级评分效果
属性:
MaxRating :最高可以给予的等级高低。没有特别指定时,最多可以到5。
CurrentRating :"评级"控件初始时的等级高低,默认值是3。
CssClass : 指定评级控件所套用的样式表。
StarCssClass :为每个可以被选择的等级(一般来说,就是那个星星图标),指定样式表。
WaitingStarCssClass :为正通过异步方式保存评级数据的等级,指定样式表。
FilledStarCssClass :为一个已经被选择的等级,指定样式表。
EmptyStarCssClass :为一个沿未被选择的等级,指定样式表。
AutoPostBack :当单击"评级"这个控件时,是否回送。默认不回送。
OnChanged :在完成评级之后,触发"客户端回调"事件以便执行某一段程序代码。
1.托放一个label用来现实评分信息。
2.拖放一个Rating控件,设置属性。
3.其实该控件的主要效果要考css来完成,编写css样式。注意四个css都必须有,否则会出错的。
4.编写后台处理代码。
this.Rating1.CurrentRating.ToString()将返回当前选择的”星“的个数
protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e) //如果将AutoPostBack设置成true则这个事件将在选择改变的时候激发
eg:
aspx页面:
<head runat="server">
<title>无标题页</title>
<style type="text/css">
.RatingStar
{
font-size:0pt;
;
height:12px;
marging:0px;
padding:0px;
cursor:pointer;
display:block;
background-repeat:no-repeat;
}
.filledRatingStar
{
background-image:url(img/AJAXEnabledWebSite105/images/FilledStar.png);
}
.emptyRatingStar
{
background-image:url(img/AJAXEnabledWebSite105/images/EmptyStar.png);
}
.savedRatingStar
{
background-image:url(img/AJAXEnabledWebSite105/images/SavedStar.png);
}
</style>
</head>
<body style="text-align: center">
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> <br />
<cc1:rating id="Rating1" runat="server" MaxRating="10" AutoPostBack="True" EmptyStarCssClass="emptyRatingStar" FilledStarCssClass="filledRatingStar" OnChanged="Rating1_Changed" StarCssClass="RatingStar" WaitingStarCssClass="savedRatingStar"></cc1:rating>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
cs页面:
protected void Button1_Click(object sender, EventArgs e)
{
this.Label1.Text = "您投了" + this.Rating1.CurrentRating.ToString() + "颗星!";
}
protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e)
{
this.Label1.Text = "您投了" + this.Rating1.CurrentRating.ToString() + "颗星!";
}
效果:
用途和效果:一种全新的等级评分效果
属性:
MaxRating :最高可以给予的等级高低。没有特别指定时,最多可以到5。
CurrentRating :"评级"控件初始时的等级高低,默认值是3。
CssClass : 指定评级控件所套用的样式表。
StarCssClass :为每个可以被选择的等级(一般来说,就是那个星星图标),指定样式表。
WaitingStarCssClass :为正通过异步方式保存评级数据的等级,指定样式表。
FilledStarCssClass :为一个已经被选择的等级,指定样式表。
EmptyStarCssClass :为一个沿未被选择的等级,指定样式表。
AutoPostBack :当单击"评级"这个控件时,是否回送。默认不回送。
OnChanged :在完成评级之后,触发"客户端回调"事件以便执行某一段程序代码。
1.托放一个label用来现实评分信息。
2.拖放一个Rating控件,设置属性。
3.其实该控件的主要效果要考css来完成,编写css样式。注意四个css都必须有,否则会出错的。
4.编写后台处理代码。
this.Rating1.CurrentRating.ToString()将返回当前选择的”星“的个数
protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e) //如果将AutoPostBack设置成true则这个事件将在选择改变的时候激发
eg:
aspx页面:
<head runat="server">
<title>无标题页</title>
<style type="text/css">
.RatingStar
{
font-size:0pt;
;
height:12px;
marging:0px;
padding:0px;
cursor:pointer;
display:block;
background-repeat:no-repeat;
}
.filledRatingStar
{
background-image:url(img/AJAXEnabledWebSite105/images/FilledStar.png);
}
.emptyRatingStar
{
background-image:url(img/AJAXEnabledWebSite105/images/EmptyStar.png);
}
.savedRatingStar
{
background-image:url(img/AJAXEnabledWebSite105/images/SavedStar.png);
}
</style>
</head>
<body style="text-align: center">
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label> <br />
<cc1:rating id="Rating1" runat="server" MaxRating="10" AutoPostBack="True" EmptyStarCssClass="emptyRatingStar" FilledStarCssClass="filledRatingStar" OnChanged="Rating1_Changed" StarCssClass="RatingStar" WaitingStarCssClass="savedRatingStar"></cc1:rating>
<asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" />
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
cs页面:
protected void Button1_Click(object sender, EventArgs e)
{
this.Label1.Text = "您投了" + this.Rating1.CurrentRating.ToString() + "颗星!";
}
protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e)
{
this.Label1.Text = "您投了" + this.Rating1.CurrentRating.ToString() + "颗星!";
}
效果:
————————————————————