MVC5 Ajax.BeginForm refresh whole page

Question

Why is the form post not happening via ajax but instead is reloading to the new page?

My .js includes:

<script src="/App/JavaScript/Libraries/jquery-1.11.1-min.js"></script>
<script src="/App/JavaScript/Libraries/jquery.validate.js"></script>
<script src="/App/JavaScript/Libraries/jquery.validate.unobtrusive.js"></script>

My razor view:

<div id="login-partial-update">
@using (Ajax.BeginForm("Login",null, new AjaxOptions
{
    UpdateTargetId = "login-partial-update",
    HttpMethod = "POST"
}, new { id = "js-form-login" }))
{
    @Html.TextBoxFor(x => x.Email, new {placeholder = "Email address"})
    <div class="errormessage">
        @Html.ValidationMessageFor(x=>x.Email)
    </div>
    @Html.PasswordFor(x => x.Password, new {placeholder = "Password"})
    <div class="errormessage">
        @Html.ValidationMessageFor(x => x.Password)
    </div>
}
</div>

My controller code:

[HttpPost]
public ActionResult Login(LoginInputModel login)
{
     return PartialView("Widgets/Popups/_LoginInput", login);
}

Am I forgetting something?

Answer 1

You have to include jquery.unobtrusive-ajax.js file in your view to make Ajax.BeginForm to work.