ASP.NET MVC 3 login page by using partial - asp.net

Question

I want to use Logon page in on home page partially (which is index page).
Then my homepage has UserName textbox, Password textbox , RememberMe checkbox and button for login and register which means Logon page is partial view.
When I run the homepage and if I click Login button, it does not work validation error even
I linked JavaScript and I put [Required] on model class.
I don't know how can I enable the validation error with JavaScript?
And how can I use the HomeController? (Homepage is default page)
Could you help me?
I am beginner, and I am just started to develop MVC application.
Index.cshtml on Home folder
<div id="border_frame">
#Html.Partial("_LogOnPartial")
</div>
LogonPartial.cshtml on Shared folder
#model MvcApplication2.Models.LogOnModel
#if (Request.IsAuthenticated)
{
<text>Welcome <strong>#User.Identity.Name</strong>!
[ #Html.ActionLink("Log Off", "LogOff", "Account") ]</text>
}
else
{
<script src="#Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
using (Html.BeginForm())
{
<div>
#Html.LabelFor(m => m.UserName)
#Html.TextBoxFor(m => m.UserName, new { style = "width:150px;" })
#Html.ValidationMessageFor(m => m.UserName)
#Html.LabelFor(m => m.Password)
#Html.PasswordFor(m => m.Password, new { style = "width:150px;" })
#Html.ValidationMessageFor(m => m.Password)
<div>
#Html.CheckBoxFor(m => m.RememberMe)
#Html.LabelFor(m => m.RememberMe)
</div>
<button name="button" class="login_button" value="logIn">Log In</button>
<button name="button" class="register_button" value="register">Register now</button>
</div>
#Html.ValidationSummary(true, "Login was unsuccessful. Please correct the errors and try again.")
}
}
AccountModel.cs
public class LogOnModel
{
[Required]
[Display(Name = "User ID")]
public string UserName { get; set; }
[Required]
[DataType(DataType.Password)]
[Display(Name = "Password")]
public string Password { get; set; }
[Display(Name = "Remember me?")]
public bool RememberMe { get; set; }
}
HomeController.cs
public ActionResult Index()
{
return View();
}

Answer 1

You have to have a post action method to handle your postback.
[HttpPost]
public ActionResult Index(LogonModel model)
{
if (ModelState.IsValid) {
// do your validation stuff
}
// If you don't return the model, validation won't work.
return View(model);
}