Rating Control Ajax can not be showing in asp.net

Question

I am using rating control which is present in ASP.NET AJAX control toolkit. I have following questions.

1. It doesn't show up anything if I drag the control unto the page
2. CSS doesn't help either
3. How do I save the rating value in database

Thank you very much.

CSS

.ratingStar
{
            font-size: 0pt;
            width: 12px;
            height: 12px;
            cursor:pointer;
            background-repeat: no-repeat;
 }


.filledRatingStar
{
  background-image: url(images/Star_filled.gif);
}


.emptyRatingStar
{
  background-image: url(images/Star_empty.gif);
}

ASPX:

<asp:Rating ID="Rating2" runat="server" CurrentRating="1" MaxRating="6"   StarCssClass="ratingStar"
                    WaitingStarCssClass="savedRatingStar"
                    FilledStarCssClass="filledRatingStar"
                    EmptyStarCssClass="emptyRatingStar"
                                RatingAlign="Vertical">
                            </asp:Rating>

Answer 1

Rating is not showing up:

1. You're missing the style for savedRatingStar
2. More importantly, because you've set RatingAling="Vertical" you must specify display:block; for ratingStar

Change your code as follows and it will work:

CSS:

<style type="text/css">
    .ratingStar
    {
        font-size: 0pt;
        width: 12px;
        height: 12px;
        cursor: pointer;
        background-repeat: no-repeat;
        display: block;
    }

    .filledRatingStar
    {
        background-image: url(images/Star_filled.gif);
    }


    .emptyRatingStar
    {
        background-image: url(images/Star_empty.gif);
    }

    .savedRatingStar
    {
        /*change this to your image name*/
        background-image: url(images/Saved_star.gif);
    }
</style>

ASPX:

<form id="form1" runat="server">
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<asp:Rating ID="Rating2" runat="server" CurrentRating="1" MaxRating="6" StarCssClass="ratingStar"
    WaitingStarCssClass="savedRatingStar" FilledStarCssClass="filledRatingStar" EmptyStarCssClass="emptyRatingStar"
    RatingAlign="Vertical" />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClick="SubmitRating" />
</form>

Saving the rating to the database:

The rating is available via the CurrentRating property of the Rating control, simply access it in code and insert it into the db (there are literally hundreds of examples on the net how to do this, I trust you'll be able to find your way from here)

protected void SubmitRating(object sender, EventArgs e)
    {
        int rating = Rating2.CurrentRating;
        //Submit to database...
    }