---
title: "Ajax Toolkit Rating Control in ASP.Net"  
description: "The Rating control provides an intuitive rating experience that allows users to select the number of stars that represents their rating. The page desi"  
author: "Pushpendra Singh"  
published: 2010-12-02  
updated: 2020-07-11  
canonical: https://www.mindstick.com/articles/277/ajax-toolkit-rating-control-in-asp-dot-net  
category: "ajax"  
tags: ["ajax"]  
reading_time: 3 minutes  

---

# Ajax Toolkit Rating Control in ASP.Net

The Rating [control](https://yourviews.mindstick.com/view/83439/bipartisan-gun-control-bill-passed-in-us-after-decades) provides an intuitive rating [experience](https://www.mindstick.com/articles/12957/best-tips-to-make-your-ghostwriting-experience-a-success) that allows users to select the number of stars that represents their rating. The page designer can specify the initial rating, the maximum rating to allow.\

**Rating [Properties](https://yourviews.mindstick.com/view/81845/now-it-s-possible-to-predict-properties-of-any-molecule):**

· **[AutoPostBack](https://www.mindstick.com/interview/2074/what-is-autopostback)** - True to cause a [postback](https://www.mindstick.com/blog/490/postback-in-asp-dot-net) on rating item click.

· **CurrentRating** - Initial rating value

· **MaxRating** - Maximum rating value

· **[ReadOnly](https://www.mindstick.com/forum/1419/how-can-i-make-the-wpf-datagrid-cells-readonly)** - Whether or not the rating can be changed

· **StarCssClass** - CSS class for a visible star

· **WaitingStarCssClass** - CSS class for a star in waiting mode

· **FilledStarCssClass** - CSS class for star in filled mode

· **EmptyStarCssClass** - CSS class for a star in empty mode

· **RatingAlign** - Alignment of the stars ([Vertical](https://www.mindstick.com/forum/12951/how-to-fix-bootstrap-tab-vertical-with-text) or Horizontal)

· **RatingDirection** - [Orientation](https://www.mindstick.com/interview/2604/what-is-orientation) of the stars.

· **OnChanged** - ClientCallBack event to fire when the rating is changed

## Code:

## Default.aspx

```
 <%-- ScriptManager control manages client script for AJAX enabled ASP.NET pages.This enables partial-page rendering and Web-service calls.You have to used this if you want to use ajax control toolkit--%><asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>  <cc1:Rating ID="Rating1" runat="server" MaxRating="5"  CurrentRating="2"  CssClass="rstar"  StarCssClass="ritem" WaitingStarCssClass="svd" FilledStarCssClass="fld" EmptyStarCssClass="empt"  AutoPostBack="True" OnChanged="Rating1_Changed"></cc1:Rating>  <asp:Label ID="Label2" runat="server" Text="Selected value:"></asp:Label><asp:Label ID="Label1" runat="server" Text=""></asp:Label>
```

Here CurrentRating="2" so current star rating will be 2. StarCssClass="ratingItem" ratingItem is defined inStyleSheet.css. WaitingStarCssClass="Saved" saved isdefined inStyleSheet.css. FilledStarCssClass="Filled" filled is defined inStyleSheet.css .

**Default.aspx.cs**

```
using System;using System.Data;using System.Configuration;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls; public partial class _Default : System.Web.UI.Page{       const int rt_min = 1;     const int rt_max = 5;      protected void Page_Load(object sender, EventArgs e)    {        if( !IsPostBack )        {            Rating(Rating1.CurrentRating);                    }    }         protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e)    {        Rating(int.Parse(e.Value));    }      public void Rating(int value) {        Label1.Text = "Selected value  " + evalRating(value, Rating1.MaxRating, rt_min, rt_max);    }      public static string evalRating(int value, int maxvalue, int minrange, int maxrange)    {        int stepDelta = (minrange==0) ? 1 : 0;        double delta = (double)(maxrange - minrange) / (maxvalue - 1);        double result = delta * value - delta * stepDelta;        return formatRes(result);    }      public static string formatRes(double value)    {        return String.Format("{0:g}", value);    } }
```

## StyleSheet.css

We apply these [style sheet](https://www.mindstick.com/forum/494/external-style-sheet) in default.aspx page by using link tag

```
.rstar{       white-space:nowrap;       margin:1em;       height:14px;}.rstar .ritem {     font-size: 0pt;     width: 13px;     height: 12px;     margin: 0px;     padding: 0px;     display: block;     background-repeat:  no-repeat;       cursor:pointer;}.rstar .fld {     background-image:  url(images/ratingStarFilled.png);}.rstar .empt {     background-image:  url(images/ratingStarEmpty.png);}.rstar .svd {     background-image:  url(images/ratingStarSaved.png);}
```

**Run the [project](https://yourviews.mindstick.com/story/1788/things-to-ensure-your-construction-project-is-successful)**

![AjaxControl Toolkit Rating Control in ASP.Net](https://www.mindstick.com/mindstickarticle/9f47c375-ea10-42ee-8619-f246d2a365ef/images/5b3fdf28-3298-406f-a1ec-daeb854d33b4.png)

When you select the star then rating value will show

![AjaxControl Toolkit Rating Control in ASP.Net](https://www.mindstick.com/mindstickarticle/9f47c375-ea10-42ee-8619-f246d2a365ef/images/4cfe3255-d59e-4966-90f6-12caa13f0114.png)

---

Original Source: https://www.mindstick.com/articles/277/ajax-toolkit-rating-control-in-asp-dot-net

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
