How to Create Login and Registration Page in ASP.NET MVC 4 ?


MVC is an architectural pattern which separates the representation and user interaction. It’s divided into three broader sections, Model, View, and Controller. Below is how each one of them handles the task.The View is responsible for the look and feel.Model represents the real world object and provides data to the View.The Controller is responsible for taking the end user request and loading the appropriate Model and View.

It is very easy to create Login and Registration Page in ASP.NET MVC 4 .Just follow below steps.


In Model,create a new class User.cs and add below code


using System.ComponentModel.DataAnnotations;

public class User
{
[Key]
public int Id{ get; set; }

[Required(ErrorMessage = "Please Provide Name", AllowEmptyStrings = false)]
public string Name { get; set; }
[Required(ErrorMessage = "Please provide password",AllowEmptyStrings = false)]
[DataType(System.ComponentModel.DataAnnotations.DataType.Password)]
public string Pwd { get; set; }

}

Now create another class UserContext.cs for Context class.Write below code in that class

using System.Data.Entity;
public class UserContext:DbContext //here we need to inherit our class UserContext with DbContext
{
public DbSet Users { get; set; }
}

Now let us go to controller.Add a controller with Controller Name as HelloWorld .Then by default we get Index Action Method.Add view to this Index() method.Let us add some methods for LogIn and Registration to this HelloWorld controller .

UserContext _db = new UserContext();
public ActionResult LogOn( ) //this method used for HttpGet url request.To show LogOn page with html controls this method used.
{
return View();
}

[HttpPost]
public ActionResult LogOn(User _user) //this method used for HttpPost url request.Used to Submit data to Model for checking user after clicking Submit button.
{
try
{
if (ModelState.IsValid)
{
var user = from n in _db.Users where n.Name == _user.Name && n.Pwd == _user.Pwd select n;
if (user.ToList().Count > 0)
{
TempData["a"] = "Login is Success"; //TempData["a"] is similar to Session["a"] used to transfer data from one view to another view. TempData["UserName"] = _user.Name;
return RedirectToAction("ViewModelDemo");

}
else
{
ViewBag.a = "Login is Failed";
}
}

}
catch
{

}

return View();


}

public ActionResult Create() //this method used for HttpGet url request.To show Create page with html controls this method used.
{
return View();

}

[HttpPost]
public ActionResult Create(User _user) //this method used for HttpPost url request.Used to Submit data to Model for creating user after clicking Submit button.

{

try
{

// TODO: Add insert logic here
if (ModelState.IsValid)
{

//Save Registration

_db.Users.Add(_user);
_db.SaveChanges();

return RedirectToAction("LogOn");

}


return View(_user);
}
catch
{
return View();
}
}

Now Create LogOn view by right clicking within LogOn method and selecting Add View Option.
In LogOn.cshtml view,add below code

@model WebApplication3.Models.User
@{
ViewBag.Title = "LogOn";
}

<h2>LogOn</h2>


@* @using (Html.BeginForm()) is used to make controls server side.If we remove this ,then Button click will not work*@

@using (Html.BeginForm()) {

<table>
<tr>
<td>Enter Name</td>
<td>@Html.TextBox("Name")
@Html.ValidationMessageFor(m => m.Name) </td></tr>
@*@Html.ValidationMessageFor(m => m.Name) is used to display Model ErrorMessages.If we remove this ,then we cannot see Model ErrorMessages. *@

<tr>
<td>Enter Password</td>
<td>@Html.TextBox("Pwd")
@Html.ValidationMessageFor(m => m.Pwd) </td>
</tr>

<tr>
<td>
<input type="submit" value="submit" />
@Html.ActionLink("Register", "Create") if you don't have an account.

</td>
</tr>
</table>
}

Now add Create view by right clicking within Create method and selecting Add View Option.
In Create.cshtml view,add below code

@model WebApplication3.Models.User

@{
ViewBag.Title = "Create";
}

<h2>Create</h2>

@* @using (Html.BeginForm()) is used to make controls server side.If we remove this ,then Button click will not work*@

@using (Html.BeginForm()) {
<table>
<tr>
<td>Enter Name</td>
<td>@Html.TextBox("Name")
@Html.ValidationMessageFor(m => m.Name) </td>

@*@Html.ValidationMessageFor(m => m.Name) is used to display Model ErrorMessages.If we remove this ,then we cannot see Model ErrorMessages. *@


</tr>
<tr>
<td>Enter Password</td>
<td>@Html.TextBox("Pwd")
@Html.ValidationMessageFor(m => m.Pwd) </td>
</tr>
<tr>
<td>
<input type="submit" value="submit" />
@Html.ActionLink("Go to Login", "LogOn") if you don't have an account.
</td>
</tr>
</table>
}


Comments



  • Do not include your name, "with regards" etc in the comment. Write detailed comment, relevant to the topic.
  • No HTML formatting and links to other web sites are allowed.
  • This is a strictly moderated site. Absolutely no spam allowed.
  • Name:
    Email: