Ajax.BeginForm does not work asynchronous

Question

I am using Ajax.BeginFrom in Index view to test the method in Home controller

@using (Ajax.BeginForm(actionName: "TestMethod",
        controllerName: "Home",
        ajaxOptions: new AjaxOptions
        {
            HttpMethod = "POST",
            InsertionMode = InsertionMode.Replace,
            UpdateTargetId = "TestInfo",
            LoadingElementId = "Progress"
        }))
{
    <input type="submit" value="Search" />
    <div id="TestInfo"></div>
}

And

[HttpPost]
public virtual ActionResult TestMethod()
{
    return Content("ok");
}

But after submit, the Page redirect to /Home/TestMethod and show 'ok' .

I've added

<add key="UnobtrusiveJavaScriptEnabled" value="true" />

in webconfig and

<script src="@Links.Scripts.jquery_unobtrusive_ajax_min_js" type="text/javascript"></script>

in my layout. But it still does not work asynchronous. Where is the problem?

Answer 1

when this happens its almost always because your script files aren't loaded, see below post :

http://completedevelopment.blogspot.com/2011/02/unobstrusive-javascript-in-mvc-3-helps.html

Set the mentioned flag in the web.config:

1. Include a reference to the jQuery library ~/Scripts/jquery-1.4.4.js

2. Include a reference to the library that hooks this magic at ~/Scripts/jquery.unobtrusive-ajax.js