RequiredFieldValidator Control in ASP.NET

Vishal Gilbile
Dec 31, 2012
25.9k
0
0
Article

RequiredFieldValidator Control

As we all know we need to do client-side scripting to validate input or to check whether all mandatory fields have been filled in by the user. So for doing such kind of validation we can either write our own JavaScript code or we can make use of builtin validation controls to validate the code. ASP.Net provides several validation controls (such as RequiredFieldValidator, CompareValidator, RegularExpressionValidator, RangeValidator etc.). Of all of these we will have a look at RequiredFieldValidator.

RequiredFieldValidator is basically doing validations against the required fields in the front end. The user must fill in all the mandatory fields, to ensure this we make use of RequiredFieldValidator.

It has certain properties that we need to set for it to function the way we want it to, for xample: it should show an error message whenever the details are not filled in. For a login form we want the user name and word, both fields, to be filled in; only then can the user click the button and the server-side processing can occur. If either of the fields are empty then an error message should be invoked or displayed.

This task is quiet simple, because in case of a login form we just want to perform validation against the two required fields (UserName and word). In the default case, whenever there is a RequiredFieldValidator inside a page and whenever the button is clicked then it will validate all the controls falling inside that page, but sometimes there exists a necessity for two or more panels and each one should be independently validated when the respective button within that panel is clicked. To do that we have to register the RequiredFieldValidator against the group of controls falling inside that particular panel.

Let's say we have a login form and the following with a corresponding forgotten word table.

RequiredField-Validator-Control-in-ASP.net1.jpg

Whenever the Log In button is clicked then only the user name and word fields should be validated and whenever the Getword button is clicked then only the UserName field should be validated which is inside the forgotten word panel. For doing such things we can make use of a ValidationGroup property of RequiredFieldValidator.

The following is the source code for that:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>
</head>
<body>
  <form id="form1" runat="server">
  <div>
<p id="panel1">
  <table>
  <tr>
  <td>User Name:</td>
  <td>
  <asp:TextBox ID="txtName" ValidationGroup="LoginFrame" runat="server"></asp:TextBox>
  </td>
  <td>
  <asp:RequiredFieldValidator ID="reqName" ControlToValidate="txtName" ValidationGroup="LoginFrame" runat="server" ErrorMessage="*"></asp:RequiredFieldValidator>
  </td>
  </tr>
  <tr>
  <td>word:</td>
  <td>
  <asp:TextBox ID="txt" runat="server" ValidationGroup="LoginFrame"></asp:TextBox>
  </td>
  <td>
  <asp:RequiredFieldValidator ID="reqword" ControlToValidate="txt" ValidationGroup="LoginFrame" runat="server" ErrorMessage="*"></asp:RequiredFieldValidator>
</td>
  </tr>
  <tr>
  <td colspan="2" align="right">
  <asp:Button ID="btnSubmit" runat="server" Text="Log In" ValidationGroup="LoginFrame" />
  </td>
  </tr>
  </table>
</p>
<p>
Incase you forgot your word...
</p>
<p id="panel2">
  <table>
  <tr>
<td>User Name:</td>
  <td>
  <asp:TextBox ID="txtUserName" ValidationGroup="ForgotwordFrame" runat="server"></asp:TextBox>
  </td>
  <td>
  <asp:RequiredFieldValidator ID="reqUserName" ControlToValidate="txtUserName" ValidationGroup="ForgotwordFrame" runat="server" ErrorMessage="*"></asp:RequiredFieldValidator>
  </td>
  </tr>
  <tr>
  <td>
  <asp:Button ID="btnGetword" runat="server" Text="Get word" ValidationGroup="ForgotwordFrame" />
  </td>
  </tr>
  </table>
</p>
  </div>
  </form>
</body>
</html>

So in the above example we have created two validationgroups; one for panel1 and the second for panel2 with the name as LoginFrame and ForgotwordFrame. The controls inside panel1 all have the ValidationGroup property set to LoginFrame and for the 2^nd Panel all controls have the ValidationGroup Property set to ForgotwordFrame. In this way we can reduce the overhead of writing complex JavaScript code and can make use of builtin Validation Controls.

If you click the Log In button the following is the output. See only the login Frame controls are being validated.

RequiredField-Validator-Control-in-ASP.net2.jpg