Validation Apply in ASP.NET MVC 3 Using Razor View

In my previous article I explained how to create controls in ASP.Net MVC 3 using Razor view. In this I give the example of how to create the registration form. Now in this article I an going to apply the validation to this registration form. For some fields like Name, Email, Phone_No and Address I apply the Required validation that gives the message please enter your Name, Email, Phone_No and Address respectively and a regular expression field for email_id that contain the @ sign. It also gives the validation summary. Now to start, use the following steps.

Step 1 : First of all please follow my previous article link, and make the form application like that.

Step 2 : Modify some files in order to apply validation, like

Code for Registration.cs file.

using System.ComponentModel.DataAnnotations;

namespace MvcApplication4.Models

{

public class Registration

{

[Required(ErrorMessage="Please enter your Name")]

public string Name { get; set; }

[Required(ErrorMessage="Please enter your valid Email_id")]

[RegularExpression(".+\\@.+\\..+",ErrorMessage="Please Enter your valid email which contains the @ Sign")]

public string Email { get; set; }

[Required(ErrorMessage="Please enter your valid phone number")]

public string Phone { get; set; }

[Required(ErrorMessage="Please enter your address")]

public string Address { get; set; }

}

Code for HomeController.cs file

namespace MvcApplication4.Controllers

{

public class HomeController : Controller

{

public ViewResult Index()

{

return View();

}

[HttpGet]

public ViewResult RegistrationForm()

{

return View();

}

[HttpPost]

public ViewResult RegistrationForm(Registration registration)

{

if (ModelState.IsValid)

{

return View("Congratualation", registration);

}

else

{

// there is a validation error - redisplay the form

return View();

}

Code for RegistrationForm.cshtml file

@model MvcApplication4.Models.Registration

Layout = null;

}

<!DOCTYPE html>

<html>

<head>

<title>RsvpForm</title>

</head>

<body>

@using (Html.BeginForm())

{

@Html.ValidationSummary()

<p>

Your name: @Html.TextBoxFor(x => x.Name)

</p>

<p>

Your email: @Html.TextBoxFor(x => x.Email)</p>

<p>

Your phone: @Html.TextBoxFor(x => x.Phone)</p>

<p>

Your address: @Html.TextBoxFor(x=>x.Address)</p>

}

</body>

</html>

Code for Index.cshtml file

Layout = null;

}

<!DOCTYPE html>

<html>

<head>

<title>Index</title>

</head>

<body>

<div>

<h3>Please fill the registration form by clicking on the following registration link</h3>

@Html.ActionLink("Registration", "RegistrationForm")

</div>

</body>

</html>

Code for Congratualation.cshtml file

@model MvcApplication4.Models.Registration

Layout = null;

}

<!DOCTYPE html>

<html>

<head>

<title>Congratualation</title>

</head>

<body>

<div>

<h1>Congratualation, @Model.Name!!!</h1>

<p>Your Registration has been Successfully completed.</p>

</div>

</body>

</html>

Step 3 : Now run the application by pressing F5, and the output looks like:

When I click on the Registration link, the registration form is open, and when I only give the name and submit then the form gives the Errormessage because I apply the validation in all the fields.

When all the fields are filled in, it does not submit the form when the submit button is clicked because the regular expression validation is applied to the email field, so that we can enter the email with the @ and . sign.

Now after giving all the valid information and the submit button is clicked the congratulation message is displayed.

Summary : In this article I discussed how to apply the validation in the form using Razor view.

3 Comments

Join the conversation! Your thoughts help the community grow.

Manav Pandya9y ago
Nice share ...................
Ayush Nautiyal11y ago
For same thing (and addition of a drop down) if you use database, it will be great and complete article.........
kalu singh rao12y ago
Thank you very much for learning in ease.