Create Rating in ASP.NET

Introduction

Online shopping websites, online forums, deal websites and bidding websites are currently in demand and are a high priority, there are even more projects in the queue for me to develop.

I have seen that these kinds of websites require an option for rating each product, deal etc. There are many ways to do this in PHP, Wordpress or a shopping cart but since we know ASP.Net is not as easy as these, because these contain plugins just to install them and copy and paste some code, and ready, but I must say that it is a very quick solution but usually these solution create other problems.

Anyways, here I explain how to "create a rating in ASP.Net".

Requirement

Add Ajaxcontroltoolkit.dll.

Code

Write the following code in your source code:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>AJAX Rating Control</title>
<style type="text/css">
.ratingStar
{
font-size: 0pt;
width: 13px;
height: 12px;
cursor: pointer;
display: block;
background-repeat: no-repeat;
}
.filledStar
{
background-image: url(image/Filled_Star.png);
}
.emptyStar
{
background-image: url(Image/Empty_Star.png);
}
.savedStar
{
background-image: url(Image/Saved_Star.png);
}
.auto-style1 {
height: 50px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</asp:ToolkitScriptManager>
<table cellpadding="0" cellspacing="0" align="left" width="500" style="color: #333333; background-color: #F0F0F0">
<tr>
<td height="40" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
</td>
</tr>
<tr>
<td height="50" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
Rate My Article</td>
</tr>
<tr>
<td align="center" class="auto-style1" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
<asp:Rating ID="Rating1" runat="server" StarCssClass="ratingStar" WaitingStarCssClass="savedStar"
FilledStarCssClass="filledStar" EmptyStarCssClass="emptyStar" AutoPostBack="true" CurrentRating="1" MaxRating="5"
OnChanged="Rating1_Changed"></asp:Rating>
</td>
</tr>
<tr>
<td height="50" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
<asp:Label ID="lbl_point" runat="server"></asp:Label>
</td>
</tr>
</table>
</div>
</form>
</body>
</html>

Add the following code for the code behind page:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e)
{
lbl_point.Text="You rated " + e.Value.ToString();
}
}

Save all the work and run the page. It will look as in the following image:

Hope it will help .

Thanks.

5 Comments

Join the conversation! Your thoughts help the community grow.

Himani Thaker7y ago
I want to increase size of star
sourav mondal 013y ago
http://www.c-sharpcorner.com/Forums/Thread/239612/how-to-create-5-star-rating-using-Asp-NetC-Sharp.aspx#ctl00_ContentPlaceHolderLeft_repeaterMessages_ctl02_labelThreadSubject
- Neha Sharma13y ago
  It's good SOurav!!
amit kumar13y ago
Stars are not visible
Anurag Sarkar13y ago
Nice but you can use XML for it.