MVC Razor View Using Simple User Registration Form

Step 1: Create Registration Table.

Create Registration Table

Create table

  1. CREATE TABLE [dbo].[Registration1](  
  2. [UserID] [int] IDENTITY(1,1) NOT NULL,  
  3. [Username] [varchar](50) NOT NULL,  
  4. [Password] [varchar](50) NOT NULL,  
  5. [FullName] [varchar](100) NOT NULL,  
  6. [EmailID] [varchar](200) NULL,  
  7. PRIMARY KEY CLUSTERED  
  8. (  
  9. [UserID] ASC  
  10. )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ONON [PRIMARY]  
  11. ON [PRIMARY]  
Step 2: Create a project.

Go to File, then New and click Project. Select ASP.NET MVC 4 Web Application and enter the project name, then click OK, select Empty, select View Engine Razor and press OK.

Step 3: Add model.

add class

enter class name

user.cs
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.ComponentModel.DataAnnotations;  
  4. using System.Linq;  
  5. using System.Web;  
  6. using System.Web.Mvc;  
  7.   
  8. namespace MVCRegistration.Models {  
  9.     public class User {  
  10.         public int UserID {  
  11.             get;  
  12.             set;  
  13.         }  
  14.         [Required(ErrorMessage = "Please provide username", AllowEmptyStrings = false)]  
  15.         public string Username {  
  16.             get;  
  17.             set;  
  18.         }  
  19.         [Required(ErrorMessage = "Please provide Password", AllowEmptyStrings = false)]  
  20.         [DataType(System.ComponentModel.DataAnnotations.DataType.Password)]  
  21.         [StringLength(50, MinimumLength = 8, ErrorMessage = "Password must be 8 char long.")]  
  22.         public string Password {  
  23.             get;  
  24.             set;  
  25.         }  
  26.         [Compare("Password", ErrorMessage = "Confirm password dose not match.")]  
  27.         [DataType(System.ComponentModel.DataAnnotations.DataType.Password)]  
  28.         public string ConfirmPassword {  
  29.             get;  
  30.             set;  
  31.         }  
  32.         [Required(ErrorMessage = "Please provide full name", AllowEmptyStrings = false)]  
  33.         public string FullName {  
  34.             get;  
  35.             set;  
  36.         }  
  37.   
  38.         [RegularExpression(@  
  39.         "^([0-9a-zA-Z]([\+\-_\.][0-9a-zA-Z]+)*)+@(([0-9a-zA-Z][-\w]*[0-9a-zA-Z]*\.)+[a-zA-Z0-9]{2,3})$",  
  40.         ErrorMessage = "Please provide valid email id")]  
  41.         public string EmailID {  
  42.             get;  
  43.             set;  
  44.         }  
  45.   
  46.     }  
  47. }  
Step 4: Add Data Enity Model

Add Data Enity Model

select connection

table

navigation properties

Step 5: Add UserController.

add controller

code

Usercontroller.cs
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.Mvc;  
  6. using MVCRegistration.Models;  
  7.   
  8. namespace MVCRegistration.Controllers {  
  9.     public class UserController: Controller {  
  10.         //  
  11.         // GET: /User/  
  12.   
  13.         public ActionResult Register() {  
  14.             return View();  
  15.         }  
  16.   
  17.         [HttpPost]  
  18.         [ValidateAntiForgeryToken]  
  19.         public ActionResult Register(Registration1 U) {  
  20.             if (ModelState.IsValid) {  
  21.                 using(RBACEntities dc = new RBACEntities()) {  
  22.                     dc.Registration1.Add(U);  
  23.                     dc.SaveChanges();  
  24.                     ModelState.Clear();  
  25.                     U = null;  
  26.                     ViewBag.Message = "Successfully Registration Done";  
  27.                 }  
  28.             }  
  29.             return View(U);  
  30.         }  
  31.   
  32.     }  
  33. }  
Step 6: Add View.

add view

Register.cshtml

  1. @model MVCRegistration.Models.User  
  2.   
  3. @{  
  4.     ViewBag.Title = "Register";  
  5.  }  
  6.   
  7.   
  8. <h2>Register</h2>  
  9.   
  10. @using (Html.BeginForm()) {  
  11.     @Html.ValidationSummary(true)  
  12.   
  13.   
  14.     <fieldset>  
  15.         <legend>User</legend>  
  16.         @Html.AntiForgeryToken()  
  17.         @if (ViewBag.Message != null)  
  18.         {  
  19.   
  20.             <div style="border:solid 1px green">  
  21.                  @ViewBag.Message  
  22.             </div>  
  23.         }  
  24.   
  25.        <div class="editor-label">  
  26.           @Html.LabelFor(model => model.FullName)  
  27.        </div>  
  28.       <div class="editor-field">  
  29.          @Html.EditorFor(model => model.FullName)  
  30.          @Html.ValidationMessageFor(model => model.FullName)  
  31.       </div>  
  32.       <div class="editor-label">  
  33.             @Html.LabelFor(model => model.EmailID)  
  34.       </div>  
  35.       <div class="editor-field">  
  36.           @Html.EditorFor(model => model.EmailID)  
  37.           @Html.ValidationMessageFor(model => model.EmailID)  
  38.       </div>  
  39.       <div class="editor-label">  
  40.           @Html.LabelFor(model => model.Username)  
  41.       </div>  
  42.       <div class="editor-field">  
  43.           @Html.EditorFor(model => model.Username)  
  44.           @Html.ValidationMessageFor(model => model.Username)  
  45.       </div>  
  46.       <div class="editor-label">  
  47.          @Html.LabelFor(model => model.Password)  
  48.       </div>  
  49.       <div class="editor-field">  
  50.           @Html.EditorFor(model => model.Password)  
  51.           @Html.ValidationMessageFor(model => model.Password)  
  52.       </div>  
  53.       <div class="editor-label">  
  54.          @Html.LabelFor(model => model.ConfirmPassword)  
  55.       </div>  
  56.       <div class="editor-field">  
  57.           @Html.EditorFor(model => model.ConfirmPassword)  
  58.           @Html.ValidationMessageFor(model => model.ConfirmPassword)  
  59.       </div>  
  60.       <p>  
  61.           <input type="submit" value="Create" />  
  62.       </p>  
  63.    </fieldset>  
  64. }  
  65.   
  66.   
  67. <div>  
  68.    @Html.ActionLink("Back to List""Index")  
  69. </div>  
  70.   
  71. @section Scripts {  
  72.    @Scripts.Render("~/bundles/jqueryval")  
  73. }  
Step 7: To run the User registration Form.

view in browser

registration

User registration

 

Ebook Download
View all
Learn
View all