如何使Ajax Rating控件出现在页面上

时间:2022-04-20 21:16:24
<cc1:Rating ID="Rating1" runat="server"
            StarCssClass="star_rating"
            WaitingStarCssClass="star_saved"
            FilledStarCssClass="star_filled"
            EmptyStarCssClass="star_empty"
            AutoPostBack="true"
            Tag="10"
            CurrentRating="2"
            MaxRating="5" BackColor="#CCFF99" BorderColor="#FF0066"
        >
    </cc1:Rating>

I read through this article:

我读完了这篇文章:

http://programming.top54u.com/post/ASP-Net-AJAX-Star-Rating-Extender-Control.aspx

http://programming.top54u.com/post/ASP-Net-AJAX-Star-Rating-Extender-Control.aspx

What are all those CSS attributes? Do i need to create CSS files.. and fill everything myself..? How can i make the control appear and be visible on the page?

那些CSS属性是什么?我是否需要创建CSS文件..并自己填写所有内容..?如何使控件显示并在页面上可见?

2 个解决方案

#1


0  

No you do not need to create css files for this just include the classes in head section.

不,你不需要为此创建css文件只包括head部分中的类。

      <head runat="server">            
         <style type="text/css">
            /* Rating */
            .ratingStar {
                      //image path for ratingStar here
                    }

          .filledRatingStar {
                   //image path for filledRatingStar  here
           }

          .emptyRatingStar {
                     //image path for emptyRatingStar  here
           }

          .savedRatingStar {
                     //image path for savedRatingStar here
          }
</style>

    </head>
  <body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
       </asp:ScriptManager>
      <div>
      <cc1:Rating ID="ThaiRating" runat="server" BehaviorID="RatingBehavior1"
                CurrentRating="2"
                MaxRating="5"
                StarCssClass="ratingStar"
                WaitingStarCssClass="savedRatingStar"
                FilledStarCssClass="filledRatingStar"
                EmptyStarCssClass="emptyRatingStar"
                OnChanged="ThaiRating_Changed"
                style="float: left;" />
   </div>
    </form>
  </body>

codebehind section

代码隐藏部分

     protected void ThaiRating_Changed(object sender, RatingEventArgs e)
     {
        Thread.Sleep(400);
        e.CallbackResult = "Update done. Value = " + e.Value + " Tag = " + e.Tag;
     }

#2


1  

Use below and you can modify accordingly. put the star images on appropriate folders :

使用以下,您可以相应地修改。将星形图像放在适当的文件夹中:

.star_rating {
    font-size: 0pt;
    width: 30px;
    height: 30px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: block;
    background-repeat: no-repeat;
    }

    .star_filled {
    background-image: url(Images/orange_star.jpg);

    }

    .star_empty {
    background-image: url(Images/grey_star.jpg);
    }

    .star_saved {
    background-image: url(Images/red_star.jpg);
    }

</style>

#1


0  

No you do not need to create css files for this just include the classes in head section.

不,你不需要为此创建css文件只包括head部分中的类。

      <head runat="server">            
         <style type="text/css">
            /* Rating */
            .ratingStar {
                      //image path for ratingStar here
                    }

          .filledRatingStar {
                   //image path for filledRatingStar  here
           }

          .emptyRatingStar {
                     //image path for emptyRatingStar  here
           }

          .savedRatingStar {
                     //image path for savedRatingStar here
          }
</style>

    </head>
  <body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
       </asp:ScriptManager>
      <div>
      <cc1:Rating ID="ThaiRating" runat="server" BehaviorID="RatingBehavior1"
                CurrentRating="2"
                MaxRating="5"
                StarCssClass="ratingStar"
                WaitingStarCssClass="savedRatingStar"
                FilledStarCssClass="filledRatingStar"
                EmptyStarCssClass="emptyRatingStar"
                OnChanged="ThaiRating_Changed"
                style="float: left;" />
   </div>
    </form>
  </body>

codebehind section

代码隐藏部分

     protected void ThaiRating_Changed(object sender, RatingEventArgs e)
     {
        Thread.Sleep(400);
        e.CallbackResult = "Update done. Value = " + e.Value + " Tag = " + e.Tag;
     }

#2


1  

Use below and you can modify accordingly. put the star images on appropriate folders :

使用以下,您可以相应地修改。将星形图像放在适当的文件夹中:

.star_rating {
    font-size: 0pt;
    width: 30px;
    height: 30px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: block;
    background-repeat: no-repeat;
    }

    .star_filled {
    background-image: url(Images/orange_star.jpg);

    }

    .star_empty {
    background-image: url(Images/grey_star.jpg);
    }

    .star_saved {
    background-image: url(Images/red_star.jpg);
    }

</style>