ASP.NET MVC Validations using MVCContrib
In my earlier
post, I have explained how to use MVCContrib Grid in ASP.net
MVC application. In this post, I demonstrate how you can use
ASP.net MVC client side validation using the MVCContrib
Validation helpers. MVCContrib is a cool contrib project to
ASP.net MVC that extends the functionalities of an ASP.net
MVC application and it provides rich set of validation
helpers and it also provides different validation groups.
The MVCContrib project can download from
http://www.CodePlex.com/MvcContrib.
The following are the steps to get Validation
Helpers to work:
Step1
Add a
reference to the MvcContrib assembly (download available
from
http://www.CodePlex.com/MvcContrib)
Step 2
Add namespace import
for MvcContrib to your web.config file:
<pages>
<namespaces>
<add namespace="MvcContrib.UI"/>
<add
namespace="MvcContrib.UI.Tags"/>
<add
namespace="MvcContrib.UI.Html"/>
<add
namespace="MvcContrib"/>
</namespaces>
</pages>
Step 3
Call
Form.ValidatorRegistrationScripts within the head
element and Form.ValidatorInitializationScripts at
the end of your body element of the required pages.
Validators requires that you call
Form.ValidatorRegistrationScripts within the head element,
Form.ValidatorInitializationScripts at the end of your body
element, and when creating your form call
Form.FormValidation as the htmlAttributes parameter.
Using the Validation Helper
The below shows the sample code
<asp:Content
ID="headContent"
ContentPlaceHolderID="head"
runat="server">
<%=
Html.Validation().ValidatorRegistrationScripts() %>
</asp:Content>
<%
using
(Html.Form("Home", "ValidationHelper",
FormMethod.Post,
Html.Validation().FormValidation("FormValidation"))) { %>
Name: <%=
Html.TextBox("Name") %>
<%=
Html.Validation().RequiredValidator("nameRequiredValidator",
"Name", "You must enter a name.", "FormValidation")%>
<br
/>
<br
/>
EMail: <%=
Html.TextBox("EMail") %>
<%=
Html.Validation().RegularExpressionValidator("emailRegexValidator",
"EMail",
@"^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9]"+
@"[\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]"+
@"*[a-zA-Z]$",
"Enter a valid Email.", "FormValidation")%>
<%=
Html.Validation().RequiredValidator("emaillRequiredValidator",
"EMail", "You must enter a EMail.","FormValidation")%>
<br
/>
<br
/>
Retype Email: <%=
Html.TextBox("RetypeEMail")%>
<%=
Html.Validation().CompareValidator("emailCompareValidator",
"RetypeEMail", EMail", ValidationDataType.String,
ValidationCompareOperator.Equal, "EMail must be same.", "FormValidation")%>
<br
/><br
/>
Age: <%=
Html.TextBox("Age") %>
<%=
Html.Validation().RangeValidator("ageRangeValidator",
"Age", "18", "60", ValidationDataType.Integer,
"Age range must be 18-60.",
"FormValidation")%>
<%=
Html.Validation().RuiredValidator("eageRequiredValidator",
"Age", "You must enter a Age.", "FormValidation")%>
<input
type=submit
value="Submit"
/>
<%
} %>
<%=
Html.Validation().ValidatorInitializationScripts() %>
</asp:Content>
In the above sample code first I have called
Form.ValidatorRegistrationScripts within the head
element.
<asp:Content
ID="headContent"
ContentPlaceHolderID="head"
runat="server">
<%=
Html.Validation().ValidatorRegistrationScripts() %>
</asp:Content>
I have added a content place holder named
"headelement" within the head element of the master page and
in my content page, called the
Html.Validation().ValidatorRegistrationScripts() method. In
the Form helper class, called
Html.Validation().FormValidation("FormValidation") as the
htmlAttributes parameter. The argument FormValidation"
specifies that the name of the validation group. You can use
different validation groups in a single page.
<%
using
(Html.Form("Home", "ValidationHelper",
FormMethod.Post,Html.Validation().FormValidation("FormValidation"))) { %>
At the end of the body element, called the
Form.ValidatorInitializationScripts
<%=
Html.Validation().ValidatorInitializationScripts() %>
The sample form using four input fields to
validate. The first input field for Name is using a
RequiredValidator
Name: <%=
Html.TextBox("Name") %>
<%=
Html.Validation().RequiredValidator("nameRequiredValidator",
"Name", "You must enter a name.", "FormValidation")%>
The first argument of Html.Validation().RequiredValidator method is the Name of the validator, second argument is the control to validate, third argument is the error message if validation fails and last argument is the name of the validation group.
I have used RegularExpressionValidator and RequiredValidator
for validating the email address.
EMail: <%=
Html.TextBox("EMail") %>
<%=
Html.Validation().RegularExpressionValidator("emailRegexValidator",
"EMail",
@"^[a-zA-Z][\w\.-]*[a-zA-Z0-9]@[a-zA-Z0-9]"+
@"[\w\.-]*[a-zA-Z0-9]\.[a-zA-Z][a-zA-Z\.]"+
@"*[a-zA-Z]$",
"Enter a valid Email.", "FormValidation")%>
<%=
Html.Validation().RequiredValidator("emaillRequiredValidator",
"EMail", "You must enter a EMail.","FormValidation")%>
The first argument of
Html.Validation().RegularExpressionValidator method is the
Name of the validator, second argument is the control to
validate, third argument is the validation expression,
fourth arguement is the error message if validation fails
and last argument is the name of the validation group.
The third input field is 'Retype Email' and a
CompareValidator is using for validate the field.
Retype Email: <%=
Html.TextBox("RetypeEMail")%>
<%=
Html.Validation().CompareValidator("emailCompareValidator",
RetypeEMail", "EMail", ValidationDataType.String,
ValidationCompareOperator.Equal, "EMail must be same.", "FormValidation")%>
The first argument of Html.Validation().CompareValidator method is the Name of the validator, second argument is the control to validate, third argument is the reference name of the compare, fourth arguement is the validation data type to compare, fifth argument is operator of the compare validation, sixth argument is the error message and last argument is the name of the validation group.
Both RangeValidator and RequiredValidator is used for
validating the Age field.
<%=
Html.Validation().RangeValidator("ageRangeValidator",
"Age", "18", "60", ValidationDataType.Integer,
"Age range must be 18-60.",
"FormValidation")%>
<%=
Html.Validation().RuiredValidator("eageRequiredValidator",
"Age", "You must enter a Age.", "FormValidation")%>
The first argument of
Html.Validation().RangeValidator method is the Name of the
validator, second argument is the control to validate, third
argument is the minimum value of the range, fourth argument
is the maximum value of the range, fifth argument is the
data type of the validation, sixth argument is the error
message and last argument is the name of the validation
group.