Step-1: Open VS 2017 >> File >> New Project >> Asp .Net application
Download the Ajax Control toolkit into the link http://www.ajaxcontroltoolkit.com/
OR
You can add the Ajax Control through Nuget Package manager.
Install-Package AjaxControlToolkit -Version 19.1.0
 |
| You can see AJAX Control Toolkit is added in Solution |
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs"
Inherits="RatingControlAjax.Default" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit"
TagPrefix="cc1" %>
<!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></title>
<style type="text/css">
.Star
{
background-image: url(images/Star.gif);
height: 17px;
width: 17px;
}
.WaitingStar
{
background-image: url(images/WaitingStar.gif);
height: 17px;
width: 17px;
}
.FilledStar
{
background-image: url(images/FilledStar.gif);
height: 17px;
width: 17px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<cc1:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
</cc1:ToolkitScriptManager>
<cc1:Rating ID="Rating1" AutoPostBack="true" OnChanged="OnRatingChanged" runat="server"
StarCssClass="Star" WaitingStarCssClass="WaitingStar" EmptyStarCssClass="Star"
FilledStarCssClass="FilledStar">
</cc1:Rating>
<br />
<asp:HiddenField ID="hdn_Rating" runat="server" />
<asp:Label ID="lblRatingStatus" runat="server" Text=""></asp:Label>
<asp:Button ID="btn_save" runat="server" Text="Save" OnClick="btn_save_Click" />
<asp:Label ID="lbl_Value" runat="server" Text=""></asp:Label>
</form>
</body>
</html>
</> Ajax is registered. We take the Rating Control and button is used to show the
data, You can save the rating data into database.
protected void OnRatingChanged(object sender, RatingEventArgs e)
{
hdn_Rating.Value = e.Value;
}
protected void btn_save_Click(object sender, EventArgs e)
{
lbl_Value.Text ="You Selected rating as "+ hdn_Rating.Value.ToString() + "" ;
}
</> OnRatingChanged() called when rating control is selected and we put that data
into hidden filed. When it Click save button the label is printed no. of star
is selected.
Step-5: Finally run our application and see the output as expected.
</> The Source Code is available in Github.com/CoreProgramm/Summary
In this tutorial we discussed how to use Rating Control in ASP .Net Ajax. If have any question related to this topic then give your feedback.
Post a Comment