EDUCBA

EDUCBA

MENUMENU
  • Free Tutorials
  • Free Courses
  • Certification Courses
  • 600+ Courses All in One Bundle
  • Login

ASP.Net CompareValidator

By Priya PedamkarPriya Pedamkar

Home » Software Development » Software Development Tutorials » ASP.NET Tutorial » ASP.Net CompareValidator

ASPNet CompareValidator new

Introduction to ASP.Net CompareValidator

CompareValidator server control is a control used to compare user inputs on the web page with a constant value or another user input. It allows the application developer to enforce a validation policy on the web page and prevent posting the form data to the server unless the validation check has passed. Why did I use the term server control? Well, because like all other server controls, ASP.NET provides its own tag for the CompareValidator control which is run at the server and the generated HTML code is returned as a response to the browser. So, thinking from an HTML perspective, the CompareValidator control generates the HTML span tag, which is hidden by default and displays an error message when the validation fails.

Syntax:

Start Your Free Software Development Course

Web development, programming languages, Software testing & others

The CompareValidator control can be coded using ASP.NET provided tags or dragged and dropped using Visual Studio IDE. The drag and drop feature ultimately generates the same code.

The syntax of ASP.NET CompareValidator in its simplest form is:

<asp:CompareValidator
ID="CompareValidatorId" runat="server"
ControlToCompare="ComparerControlId"
ControlToValidate="TargetControlId"
ErrorMessage="ErrorMessage">
</asp:CompareValidator>

The above mentioned are the basic required properties of CompareValidator control. Let’s understand what each property signifies:

  • ID: A unique id of the CompareValidator control.
  • ControlToCompare: The id of the control whose value would be used as the comparator. An optional property in case the comparator is a constant value and not a user input.
  • ControlToValidate: The id of the control whose value would be compared. A mandatory property.
  • ErrorMessage: The message to be displayed when validation fails.

Behind the Scenes

So, how does the CompareValidator mechanism work? When the ASP.NET engine encounters the control, it adds a task in the checklist before posting the form to the server. The validation is triggered whenever the focus is removed from either the control to validate or the control to compare. If the validation fails, an error message is displayed. The validation check has to pass in order to post the form data to the server.

Properties of ASP.Net CompareValidator

The ASP.NET CompareValidator control comes with certain pre-defined properties. These properties are converted to attributes in the native HTML code. They help define additional behavior for the CompareValidator control. Let’s discuss some of the frequently used ones in detail:

Popular Course in this category
ASP.NET Training (8 Courses, 19 Projects)8 Online Courses | 19 Hands-on Projects | 105+ Hours | Verifiable Certificate of Completion | Lifetime Access
4.5 (5,995 ratings)
Course Price

View Course

Related Courses

1. BackColor, ForeColor

This property gets or sets the background and the foreground color of the control.

<asp:CompareValidator ID="myCompareValidator" ControlToCompare="TextBox_1" ControlToValidate="TextBox_2" ErrorMessage="Error" BackColor="DarkBlue" ForeColor="White" runat=“server”> </asp:CompareValidator>

2. BorderColor, BorderStyle and BorderWidth

These properties get or set the border styling for the control.

<asp:CompareValidator ID=“myCompareValidator” ControlToCompare=“TextBox_1” ControlToValidate=“TextBox_2” ErrorMessage=“Error” BorderWidth="5" BorderColor="Blue" BorderStyle="dashed" runat=“server”> </asp:CompareValidator>

3. CssClass

This property gets or sets the CSS class to be applied to the control.

<asp:CompareValidator ID=“myCompareValidator” ControlToCompare=“TextBox_1” ControlToValidate=“TextBox_2” ErrorMessage=“Error” CssClass="txtBxClass" runat=“server”> </asp:CompareValidator>

4. Enabled

This property gets or sets the value indicating whether the control is enabled or disabled. The default value is true.

<asp:CompareValidator ID=“myCompareValidator” ControlToCompare=“TextBox_1” ControlToValidate=“TextBox_2” ErrorMessage=“Error” Enabled="false" runat=“server”> </asp:CompareValidator>

5. Font

This property gets or sets the font of the text to be displayed in the control. There are plenty of styles and options such as bold, italics, underline, strikeout, etc.

6. Height, Width

These properties get or set the height and width of the control in the number of pixels.

<asp:CompareValidator ID=“myCompareValidator” ControlToCompare=“TextBox_1” ControlToValidate=“TextBox_2” ErrorMessage=“Error” Height="100" Width="500" runat=“server”> </asp:CompareValidator>

7. ID

This property gets or sets the unique identifier attribute to the control.

<asp:CompareValidator ID=“myCompareValidator” ControlToCompare=“TextBox_1” ControlToValidate=“TextBox_2” ErrorMessage=“Error” runat=“server”> </asp:CompareValidator>

8. Type

This property gets or sets the data type in which the values are converted before being compared.

<asp:CompareValidator ID=“myCompareValidator” ControlToCompare=“TextBox_1” ControlToValidate=“TextBox_2” ErrorMessage=“Error” Type="string" runat=“server”> </asp:CompareValidator>

9. Visible

This property determines whether the control will be displayed on the UI or hidden. The default is true.

<asp:CompareValidator ID=“myCompareValidator” ControlToCompare=“TextBox_1” ControlToValidate=“TextBox_2” ErrorMessage=“Error” Visible="false" runat=“server”> </asp:CompareValidator>

Examples of ASP.Net CompareValidator

Let us create a CompareValidator sample application in a step by step manner.

Step 1: Create a new ASP.NET WebApplication project. This will create a shell template with a working application with a Default.aspx and Default.aspx.cs page. The .cs page is the code behind page for the .aspx page.

Step 2: Go to the Default.aspx file and remove the contents of the shell template to look like below.

ASP.Net CompareValidator-1.1

Step 3: In the Toolbox pane of Visual Studio IDE, you would notice a set of Validation Controls ready to drag and drop in your project. Find the CompareValidator control and drag it in the Default.aspx page.

ASP.Net CompareValidator-1.2

Step 4: Once you drop the CompareValidator control, you would notice an auto-generated ASP.NET CompareValidator tag in your Default.aspx file. Modify the code to look like below.

ASP.Net CompareValidator-1.3

Alternatively, you can skip the drag and drop part and write the above code yourself.

<asp:CompareValidator ID="pass_repass_compare" runat="server"
ControlToCompare="pass_txt"
ControlToValidate="repass_txt"
Type="String"
ForeColor="DarkRed"
ErrorMessage="Passwords do not match!">
</asp:CompareValidator>

Step 5: Copy the below code in your Default.aspx file.

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master"
AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="SampleWebApplication._Default" %>
<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<br /><br />
<asp:Label ID="pass_lbl" runat="server" Text="Label">Enter Password</asp:Label>
<asp:TextBox ID="pass_txt" TextMode="Password" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="repass_lbl" runat="server" Text="Label">Re-enter Password</asp:Label>
<asp:TextBox ID="repass_txt" TextMode="Password" runat="server"></asp:TextBox>
<br /><br />
<asp:Label ID="msg" runat="server" Text=""></asp:Label>
<br /><br />
<asp:CompareValidator ID="pass_repass_compare" runat="server"
ControlToCompare="pass_txt"
ControlToValidate="repass_txt"
Type="String"
ForeColor="DarkRed"
ErrorMessage="Passwords do not match!">
</asp:CompareValidator>
<br /><br />
<asp:Button ID="Validate_btn" runat="server" OnClick="Validate_btn_Click" Text="Validate" />
</asp:Content>

Step 6: Copy the below code in your Default.aspx.cs file.

using System;
using System.Web.UI;
namespace SampleWebApplication
{
public partial class _Default : Page
{
protected void Validate_btn_Click(object sender, EventArgs e)
{
if (Page.IsValid) {
msg.Text = "Account created successfully.";
}
}
}
}

Step 7: Run the application. Below is the output of your code. It has two text boxes and a validation control to check whether the values of both the text boxes match or not.

The code-behind the file has a button click function to the Validate button. This method is called only when the CompareValidator results in a pass.

Output-1.4

The above is the landing page of your application. Enter a password and then re-type the password. If both the passwords do not match, an error is displayed and no call to the code behind the function is made. This simply means that the data is not posted to the server unless the passwords match.

Output-1.5

When the passwords match, the code behind the function is executed and a message is displayed.

ASP.Net CompareValidator-1.6

Recommended Articles

This is a guide to ASP.Net CompareValidator. Here we discuss the Introduction and Properties of ASP.Net compare validator along with examples and syntax. You may also look at the following articles to learn more –

  1. Radio Button in ASP.NET
  2. Ajax in ASP.NET
  3. Caching in .NET Framework
  4. Button in ASP.NET

ASP.NET Training (8 Courses, 19 Projects)

8 Online Courses

19 Hands-on Projects

105+ Hours

Verifiable Certificate of Completion

Lifetime Access

Learn More

0 Shares
Share
Tweet
Share
Primary Sidebar
ASP.NET Tutorial
  • ASP.Net Validation
    • ASP.Net Validation Controls
    • ASP.Net CompareValidator
    • ASP.NET RequiredFieldValidator
    • ASP.NET ValidationSummary
    • ASP.NET RegularExpressionValidator
  • Basic
    • What is ASP.NET
    • Features of ASP.NET
    • ASP.NET Versions
    • ASP.NET Framework
    • What is MVVM
    • What is Eclipse IDE?
    • ASP.NET Page Life Cycle
    • ASP.NET Server Controls
    • Caching In ASP.NET
    • Data Binding in ASP.NET
    • What is ASP.Net Web Services
    • ASP.Net Interview Questions
    • Asp.Net MVC Interview Questions
    • AJAX Interview Questions
    • What is LINQ
    • Ajax in ASP.NET
  • ASP.NET Controls
    • ASP.NET Label
    • ASP.NET TextBox
    • Button in ASP.NET
    • ASP.NET CheckBoxList
    • ASP.NET DataList
    • RadioButton in ASP.NET
    • ASP.NET CheckBox
    • ASP.NET Hidden Field
    • ASP.NET LinkButton
    • ImageButton in ASP.NET
    • ASP.NET ListBox
    • Drop Down List in ASP.NET
    • ASP.NET Image
    • ASP.NET MVC ViewBag
    • ASP.NET GridView
    • Calendar in ASP.NET
    • ASP.NET Datagrid
    • ASP.NET Hyperlink
    • Timer in ASP.NET
    • ASP.NET Cookie
    • ASP.NET Session
    • ASP.NET SessionID
    • ASP.NET FileUpload
    • ASP.NET Download File
    • ASP.NET UpdatePanel
    • Authentication in ASP.NET
    • ASP.NET MVC Routing
    • ASP.NET MVC Authentication
    • ASP.NET ViewState
Footer
About Us
  • Blog
  • Who is EDUCBA?
  • Sign Up
  • Corporate Training
  • Certificate from Top Institutions
  • Contact Us
  • Verifiable Certificate
  • Reviews
  • Terms and Conditions
  • Privacy Policy
  •  
Apps
  • iPhone & iPad
  • Android
Resources
  • Free Courses
  • Java Tutorials
  • Python Tutorials
  • All Tutorials
Certification Courses
  • All Courses
  • Software Development Course - All in One Bundle
  • Become a Python Developer
  • Java Course
  • Become a Selenium Automation Tester
  • Become an IoT Developer
  • ASP.NET Course
  • VB.NET Course
  • PHP Course

© 2020 - EDUCBA. ALL RIGHTS RESERVED. THE CERTIFICATION NAMES ARE THE TRADEMARKS OF THEIR RESPECTIVE OWNERS.

EDUCBA Login

Forgot Password?

EDUCBA
Free Software Development Course

Web development, programming languages, Software testing & others

*Please provide your correct email id. Login details for this Free course will be emailed to you
Book Your One Instructor : One Learner Free Class

Let’s Get Started

This website or its third-party tools use cookies, which are necessary to its functioning and required to achieve the purposes illustrated in the cookie policy. By closing this banner, scrolling this page, clicking a link or continuing to browse otherwise, you agree to our Privacy Policy

EDUCBA

*Please provide your correct email id. Login details for this Free course will be emailed to you
EDUCBA
Free Software Development Course

Web development, programming languages, Software testing & others

*Please provide your correct email id. Login details for this Free course will be emailed to you

Special Offer - ASP.NET Training (8 Courses, 19 Projects) Learn More