Learn ASP.NET MVC Step By Step For Beginners - Part Three

In this blog you will learn the ASP.NET MVC step by step.

Introduction

This session is the third part of the Learn ASP.NET MVC Step By Step for Beginners. I suggest reading the articles:

• Learn ASP.NET MVC Step By Step For Beginners- Part One
• Learn ASP.NET MVC Step By Step For Beginners- Part Two

In this article, we will discuss,

What Are DataAnnotations?

How Do We Add Validations Using Model and DataAnnotations?

DataAnnotations

DataAnnotations use different attributes on our model to implement validations. DataAnnotations include built-in validation attributes for different validation rules, which can be applied to the properties of model class. The DataAnnotations attributes are included in System.ComponentModel. DataAnnotations namespace.

The following table lists DataAnnotations validation attributes.



Step 1 First of all, open a Visual Studio 2012

1. File-> New-> Project.
   
   
   
   
2. Visual C#-> Web-> ASP.NET MVC 4 Web Application-> Name your project -> Ok.
   
   
   
   
3. From the New ASP.NET Project dialog, select MVC as shown below. And also select View Engine Razor.
   
   
   
   
4. Visual Studio creates the following folder structure for MVC application by default.
   
   
   

Step 2 Add Student Model Class

1. Right click on Model folder -> Add -> click on Class.
   
   
   
   
2. In the Add New Item dialog box, enter class name 'Student' and click Add.
   
   
   
   
3. This will add new Student class in model folder.
   
   
   
   
4. Add properties to Student Class Model as shown below.
   
   
   

Step 3 apply DataAnnotation attribute on the properties of Student model class.

We want to validate that Student Name, Email, and Age is not blank. Name cannot more than 20 characters, Age should be between 18 and 50. Email is in a correct format.

1. Add following Namespaces in Student Model Class.
   

   using System;
   using System.Collections.Generic;
   using System.ComponentModel.DataAnnotations;
   using System.Linq;
   using System.Web;

2. Apply DataAnnotation Attributes in Student Class as shown below.
   

   using System;
   using System.Collections.Generic;
   using System.ComponentModel.DataAnnotations;
   using System.Linq;
   using System.Web;
   namespace ValidationInModel.Models {
       public class Student {
           public int SId {
               get;
               set;
           }
           [Required(ErrorMessage = "name is required")]
           [StringLength(20, ErrorMessage = "name can not more than 20 characters")]
           public string name {
               get;
               set;
           }
           [Required(ErrorMessage = "Email is required")]
           [RegularExpression(@ "^([\w.\-]+)@([\w\-]+)((\.(\w){2,3})+)$", ErrorMessage = "Email is not in a correct format")]
           public string mail {
               get;
               set;
           }
           [Required(ErrorMessage = "Age is required")]
           [Range(18, 30, ErrorMessage = "Age Should be Between 18 to 30")]
           public int age {
               get;
               set;
           }
       }
   }

Step 4 Adding New Controller

1. Visual Studio, right click on the Controller folder -> select Add -> click on Controller.
   
   
   
   
2. It will open Add Controller dialog as shown below.
   
   
   
   
3. Write Controller Name. Do not delete the word Controller. Remember, controller name must end with Controller.
   
   
   
   
4. This will create HomeController class with Index method in HomeController.cs file under Controllers folder, as shown below.
   
   
   
   Note Rebuild Project.

Step 5 Add View

1. Open a HomeController class -> right click inside Index method -> click Add View.
   
   
   
   
2. In the Add View dialogue box, keep the view name as Index. It's good practice to keep the view name the same as the action method name so that you don't have to specify view name explicitly in the action method while returning the view.
3. Select View Engine Razor.
4. Create a Strongly typed view.
5. Select Model Class
   
   
   
   
6. Add Code in View As Shown Below.
   

   @model ValidationInModel.Models.Student
   @ {
       Layout = null;
   } < !DOCTYPE html > < html > < head > < meta name = "viewport"
   content = "width=device-width" / > < title > Index < /title> < /head> < body > < div > @using(Html.BeginForm()) { < p > Name @Html.TextBoxFor(m => m.name)
       @Html.ValidationMessageFor(m => m.name) < /p> < p > Mail @Html.TextBoxFor(m => m.mail)
       @Html.ValidationMessageFor(m => m.mail) < /p> < p > Age @Html.TextBoxFor(m => m.age)
       @Html.ValidationMessageFor(m => m.age) < /p> < p > < input type = "submit"
       value = "insert" / > < /p>
   } < /div> < /body> < /html>

Step 5 Create the POST Action Method in HomeController.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using ValidationInModel.Models; //add namespace of model here
namespace ValidationInModel.Controllers {
        public class HomeController Controller {
            public ActionResult Index() {
                    return View();
                }
                [HttpPost]
            public ActionResult Index(Student obj) {
                return View();
            }
        }
    }

OUTPUT 1

OUTPUT 2



OUTPUT 3