Model Validation In ASP.NET MVC Core 3.1

In this article we will understand the concept of model validation in ASP.NET MVC core 3.1. It is valid for any version of MVC core. These validations are available in System.ComponentModel.DataAnnotations namespace. Validation attributes let us specify validation rules for model properties. Model state represents errors that come from two sub systems' model binding and model validation.

 

There are in-built attributes in ASP.NET MVC core,

 

Attribute	Description
CreditCard	This validates that the property has a credit card format.
Compare	This attribute validates that two property in model class match like password and compare password.
EmailAddress	This validates the property has email address format.
Phone	This validates that the property has a telephone number format.
Range	This validates that the property value within a specified range.
RegularExpression	This validates that the property value matches a specified regular expression.
Required	This validates that the field is not null
StringLength	This validates that a string property value doesn't exceed a specified length limit.
Url	This validates that the property has a URL format.
Remote	This validates input on the client by calling an action method on the server

 

Step 1

 

Start-up Visual Studio 2019. Now click on create new project and Choose ASP.NET Core Web Application and click on “Next”

 

 

After clicking next, another wizard will open. Under the project name, give a meaningful name to your project and click on create.

 

 

That will open up another new wizard. Select ASP.Net Core 3.0 from the dropdown. If not, select default. Choose Web Application (Model-View-Controller) template and click on create which will create ASP.Net Core Application.

 

 

Step 2

 

Now right click on Models folder and “Add” class and name it Student.

using System;
using System.ComponentModel.DataAnnotations;

namespace MvcCoreModelValidation_Demo.Models
{
    public class Student
    {
        [Key]
        public int Id { get; set; }

        [Required(ErrorMessage = "Please enter name")]
        [StringLength(100)]
        public string Name { get; set; }

        [Required(ErrorMessage = "Please choose gender")]
        public string Gender { get; set; }

        [Required(ErrorMessage = "Please enter date of birth")]
        [Display(Name = "Date of Birth")]
        [DataType(DataType.Date)]
        public DateTime DateofBirth { get; set; }

        [Required(ErrorMessage = "Choose batch time")]
        [Display(Name = "Batch Time")]
        [DataType(DataType.Time)]
        public DateTime BatchTime { get; set; }

        [Required(ErrorMessage = "Please enter phone number")]
        [Display(Name = "Phone Number")]
        [Phone]
        public string PhoneNumber { get; set; }

        [Required(ErrorMessage = "Please enter email address")]
        [Display(Name = "Email Address")]
        [EmailAddress]
        public string Email { get; set; }

        [Required(ErrorMessage = "Please enter website url")]
        [Display(Name = "Website Url")]
        [Url]
        public string WebSite { get; set; }

        [Required(ErrorMessage = "Please enter password")]
        [DataType(DataType.Password)]
        public string Password { get; set; }

        [Required(ErrorMessage = "Please enter confirm password")]
        [Display(Name = "Confirm Password")]
        [Compare("Password", ErrorMessage = "Password and confirm password does not match")]
        public string ConfirmPassword { get; set; }
    }
}

Step 3

 

Now open HomeController which is added when we created new project. Write the following code for Index and New IActionResult methods.

using Microsoft.AspNetCore.Mvc;
using MvcCoreModelValidation_Demo.Models;

namespace MvcCoreModelValidation_Demo.Controllers
{
    public class HomeController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }

        [HttpPost]
        [ValidateAntiForgeryToken]
        public IActionResult Index(Student student)
        {
            if (ModelState.IsValid)
            {

            }
            return View();
        }

    }
}

Step 4

 

Right click on Index IActionResult method. “Add” view with default name “Index” if you don’t have it. Write the following code.

@model MvcCoreModelValidation_Demo.Models.Student

@{
    ViewData["Title"] = "Home Page";
}

<div class="card">
    <div class="card-header bg-primary text-white text-uppercase">
        <h4>Student Information</h4>
    </div>
    <div class="card-body">
        <form asp-action="Index">
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group">
                        <label asp-for="Name" class="lable-control"></label>
                        <input asp-for="Name" class="form-control" />
                        <span asp-validation-for="Name" class="text-danger"></span>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-group">
                        <label asp-for="Gender" class="lable-control"></label>
                        <select class="custom-select">
                            <option value="">Choose Gender</option>
                            <option value="Male">Male</option>
                            <option value="Female">Female</option>
                        </select>
                        <span asp-validation-for="Gender" class="text-danger"></span>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group">
                        <label asp-for="DateofBirth" class="lable-control"></label>
                        <input asp-for="DateofBirth" class="form-control" />
                        <span asp-validation-for="DateofBirth" class="text-danger"></span>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-group">
                        <label asp-for="BatchTime" class="lable-control"></label>
                        <input asp-for="BatchTime" class="form-control" />
                        <span asp-validation-for="BatchTime" class="text-danger"></span>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-4">
                    <div class="form-group">
                        <label asp-for="PhoneNumber" class="lable-control"></label>
                        <input asp-for="PhoneNumber" class="form-control" />
                        <span asp-validation-for="PhoneNumber" class="text-danger"></span>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="form-group">
                        <label asp-for="Email" class="lable-control"></label>
                        <input asp-for="Email" class="form-control" />
                        <span asp-validation-for="Email" class="text-danger"></span>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="form-group">
                        <label asp-for="WebSite" class="lable-control"></label>
                        <input asp-for="WebSite" class="form-control" />
                        <span asp-validation-for="WebSite" class="text-danger"></span>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group">
                        <label asp-for="Password" class="lable-control"></label>
                        <input asp-for="Password" class="form-control" />
                        <span asp-validation-for="Password" class="text-danger"></span>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="form-group">
                        <label asp-for="ConfirmPassword" class="lable-control"></label>
                        <input asp-for="ConfirmPassword" class="form-control" />
                        <span asp-validation-for="ConfirmPassword" class="text-danger"></span>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <button type="submit" class="btn btn-primary rounded-0">Submit</button>
            </div>
        </form>
    </div>
</div>

Step 5 

 

Build and run your application by pressing ctrl+F5