Chinaunix首页 | 论坛 | 博客
  • 博客访问: 1047356
  • 博文数量: 254
  • 博客积分: 10185
  • 博客等级: 上将
  • 技术积分: 2722
  • 用 户 组: 普通用户
  • 注册时间: 2007-07-25 15:04
文章存档

2011年(8)

2009年(1)

2008年(31)

2007年(214)

分类: 系统运维

2007-08-27 10:13:27

        RatingExtender用于对某个事物进行评价时使用,它可以让你自定义等级。

下面看一个示例:

1)在VS2005中新建一个ASP.NET AJAX-Enabled Web Project项目工程,命名为RatingExtender1。

2)在Default.aspx页面上拖放一个UpdatePanel,命名为UpdatePanel1。在UpdatePanel1里面拖放一个RatingExtender,命名为Rating1,用于对电影进行评价。同时在Rating1下面拖放两个DropDownList,一个用于设置对齐方向,另一个用于排列方向。

3)然后再拖放一个Button和Label,用于显示你的评分结果。

代码如下:
 1        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
 2            <ContentTemplate>
 3        对这部电影进行评价:<cc1:Rating ID="Rating1" runat="server" CurrentRating="2" StarCssClass="ratingStar" FilledStarCssClass="filledRatingStar" EmptyStarCssClass="emptyRatingStar" WaitingStarCssClass="savedRatingStar" OnChanged="Rating1_Changed">
 4        cc1:Rating>
 5                <br />
 6        转换对齐方式:<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True">
 7            <asp:ListItem>Horizontalasp:ListItem>
 8            <asp:ListItem>Verticalasp:ListItem>
 9        asp:DropDownList><br />
10        转换移动方向:<asp:DropDownList ID="DropDownList2" runat="server" AutoPostBack="True">
11            <asp:ListItem>Left to Right or Top to Bottomasp:ListItem>
12            <asp:ListItem>Right to Left or Bottom to Topasp:ListItem>
13        asp:DropDownList><br />
14                 <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Button" /><br />
15                <asp:Label ID="Label1" runat="server">asp:Label>
16            ContentTemplate>
17        asp:UpdatePanel>

属性说明:

      CurrentRating:Rating当前的默认等级。
      StarCssClass:该控件显示所采用的Css样式。
      FilledStarCssClass:该控件点击填充好后所应用的Css样式。
      EmptyStarCssClass:当控件中未点击部分,鼠标也未滑过部分所应用的Css样式。
      WaitingStarCssClass:控件中未点击部分,当鼠标滑过时所采用的Css样式。
      OnChanged:控件等级改变时所要执行的内容。

4)然后添加Rating1_Changed事件内容。

代码如下:
System.Threading.Thread.Sleep(1000);
这句代码的主要作用是延迟一下,让你感觉到它的变化。

5)然后在Page_Load事件中,添加代码,用于响应两个DropDownList控件的回传。

代码如下:
1            Rating1.RatingAlign = (DropDownList1.SelectedIndex == 1? Orientation.Vertical : Orientation.Horizontal;
2            Rating1.RatingDirection = (DropDownList2.SelectedIndex == 1? RatingDirection.RightToLeftBottomToTop:RatingDirection.LeftToRightTopToBottom  ;
3

6)最后对按钮Button控件添加事件函数,用于显示你的评分结果。

代码如下:

 1            int rate = 0;
 2            switch (Rating1.CurrentRating)
 3            {
 4                case 1:
 5                    rate = 1;
 6                    break;
 7                case 2:
 8                    rate=2;
 9                    break;
10                case 3:
11                    rate = 3;
12                    break;
13                case 4:
14                    rate = 4;
15                    break;
16                case 5:
17                    rate = 5;
18                    break;
19            }

20
21            if (rate == 0)
22            {
23                this.Label1.Text = "你未对此影片评价";
24            }

25            else
26            {
27                this.Label1.Text = "你的评分为" + rate;
28            }

7)按下CTRL+F5,在浏览器中查看效果。

效果图如下:
 
阅读(1186) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~