@model HelloWorldMvcApp.User
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
.field-validation-error {
<div class="col-md-6 col-md-offset-3">
@using (@Html.BeginForm("Login", "Login", FormMethod.Post, new {@id="loginForm"}))
<input type="text" class="form-control" placeholder="Username" id="UserName" name="UserName">
<input type="password" class="form-control" placeholder="Password" id="Password" name="Password">
<button class="btn btn-warning btn-block" type="submit" id="signin">login</button>
src="https://code.jquery.com/jquery-3.1.1.min.js"
integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8="
crossorigin="anonymous"></script>
src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/jquery.validate.min.js"></script>
src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.6/jquery.validate.unobtrusive.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
$("#signin").click(function ()
$("#loginForm").validate({
required: "username req",
minlength: "user is small",
maxlength: "user is long"
minlength: "pass is small",
maxlength: "pass is long"
submitHandler: function (form) {
var form = $('#loginForm');
url: form.attr('Login'), // the action it
success: function (data) {
alert("Username doesn't exist");