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:

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
  3. <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
  4. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  5. <html xmlns="http://www.w3.org/1999/xhtml">
  6. <head runat="server">
  7. <title>AJAX Rating Control</title>
  8. <style type="text/css">
  9. .ratingStar
  10. {
  11. font-size: 0pt;
  12. width: 13px;
  13. height: 12px;
  14. cursor: pointer;
  15. display: block;
  16. background-repeat: no-repeat;
  17. }
  18. .filledStar
  19. {
  20. background-image: url(image/Filled_Star.png);
  21. }
  22. .emptyStar
  23. {
  24. background-image: url(Image/Empty_Star.png);
  25. }
  26. .savedStar
  27. {
  28. background-image: url(Image/Saved_Star.png);
  29. }
  30. .auto-style1 {
  31. height: 50px;
  32. }
  33. </style>
  34. </head>
  35. <body>
  36. <form id="form1" runat="server">
  37. <div>
  38. <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
  39. </asp:ToolkitScriptManager>
  40. <table cellpadding="0" cellspacing="0" align="left" width="500" style="color: #333333; background-color: #F0F0F0">
  41. <tr>
  42. <td height="40" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
  43. </td>
  44. </tr>
  45. <tr>
  46. <td height="50" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
  47. Rate My Article</td>
  48. </tr>
  49. <tr>
  50. <td align="center" class="auto-style1" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
  51. <asp:Rating ID="Rating1" runat="server" StarCssClass="ratingStar" WaitingStarCssClass="savedStar"
  52. FilledStarCssClass="filledStar" EmptyStarCssClass="emptyStar" AutoPostBack="true" CurrentRating="1" MaxRating="5"
  53. OnChanged="Rating1_Changed"></asp:Rating>
  54. </td>
  55. </tr>
  56. <tr>
  57. <td height="50" style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: small;">
  58. <asp:Label ID="lbl_point" runat="server"></asp:Label>
  59. </td>
  60. </tr>
  61. </table>
  62. </div>
  63. </form>
  64. </body>
  65. </html>
Add the following code for the code behind page:
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Web;
  5. using System.Web.UI;
  6. using System.Web.UI.WebControls;
  8. public partial class _Default : System.Web.UI.Page
  9. {
  10. protected void Page_Load(object sender, EventArgs e)
  11. {
  12. }
  13. protected void Rating1_Changed(object sender, AjaxControlToolkit.RatingEventArgs e)
  14. {
  15. lbl_point.Text="You rated " + e.Value.ToString();
  16. }
  17. }
Save all the work and run the page. It will look as in the following image:

ASP.jpg

Hope it will help .

Thanks.