As shown in, the level control (this control mainly specifies the style ):
Page code:
<Head runat = "server"> <br/> <title> No title page </title> <br/> <MCE: style type = "text/CSS"> <! -- <Br/>. ratingstar <br/>{< br/> font-size: 0pt; <br/> width: 15px; <br/> Height: 12px; <br/> padding: 1px; <br/> margin: 1px; <br/> cursor: pointer; <br/> display: block; <br/> background-repeat: No-Repeat; <br/> background-color: #99cc99; <br/>}< br/>. filledratingstar <br/>{< br/> background-image: URL (image/star1.gif); <br/>}< br/>. emptyratingstar <br/>{< br/> background-image: URL (image/star2.gif); <br/>}< br/>. savedratingstar <br/>{< br/> background-image: URL (image/star3.gif); <br/>}</P> <p> --> </MCE: style> <style type = "text/CSS" mce_bogus = "1">. ratingstar <br/>{< br/> font-size: 0pt; <br/> width: 15px; <br/> Height: 12px; <br/> padding: 1px; <br/> margin: 1px; <br/> cursor: pointer; <br/> display: block; <br/> background-repeat: No-Repeat; <br/> background-color: #99cc99; <br/>}< br/>. filledratingstar <br/>{< br/> background-image: URL (image/star1.gif); <br/>}< br/>. emptyratingstar <br/>{< br/> background-image: URL (image/star2.gif); <br/>}< br/>. savedratingstar <br/>{< br/> background-image: URL (image/star3.gif ); <br/>}< br/> </style> <br/> </pead> <br/> <body> <br/> <Form ID = "form1" runat = "server"> <br/> <div> <br/> <asp: scriptmanager id = "scriptmanager1" runat = "server"> <br/> </ASP: scriptmanager> </P> <p> </div> <br/> <asp: updatepanel id = "updatepanel1" runat = "server"> <br/> <contenttemplate> <br/> <PC3: rating id = "rating1" runat = "server" width = "96px" leading = "emptyratingstar" leading = "emptyratingstar" leading = "filledratingstar" starcssclass = "ratingstar" currentrating = "2 "> <br/> </PC3: rating> <br/> <asp: button id = "button1" runat = "server" text = "button" onclick = "button#click"/> <br/> <asp: label id = "label1" runat = "server" text = "label"> </ASP: Label> <br/> </contenttemplate> <br/> </ASP: updatepanel> <br/> </form> <br/> </body>
Background code:
Protected void button#click (Object sender, eventargs E)
{
Label1.text = rating1.Currentrating. Tostring ();
}
Common attribute labels for the rating Control
Attribute label Name Description
Currentrating the current rating control rating, that is, the number of stars selected currently
Maxrating the maximum rating supported by the rating control, that is, the maximum number of stars
The direction of the ratingalign star icon. Vertical (vertical) and horizontal (horizontal) are optional)
The START direction of the ratingdirection star icon. Options include lefttorighttoptobottom (left-to-right/top-to-bottom) and righttoleftbottomtotop (right-to-left/bottom-to-top)
Readonly: If this attribute value is set to true, the rating control is read-only and the user cannot modify the rating.
CSS class applied by starcssclass star icon
Waitingstarcssclass: the CSS class applied by the star icon when the user's rating changes and the change is still in the process of Asynchronously submitting it back to the server for storage
CSS class applied to the star icon selected by filledstarcssclass
CSS class applied by the star icon not selected in emptystarcssclass
Onchanged specifies the function for processing the changed event. The changed event is triggered when the user changes the rating and sent back to the server asynchronously instead of the whole page. In this way, the selected value can be obtained in the event processing function on the server side, and subsequent operations can be performed.
Tag a context string used as the additional information. The additional information is passed to the server-side handler of the changed event, so that the value can be used as needed.
Note: In the CSS class specified by waitingstarcssclass, filledstarcssclass, and emptystarcssclass attributes, the background-image attribute should be used to specify the corresponding image for different types of star icons. In this way, the rating control does not need to directly expose the URL attribute of the star icon file in various situations.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
