Ajax.BeginForm in asp.net - asp.net

Question

The issue i am facing has taken more then 8 hours but couldn't find the solution to it.
I am trying to implement ajax functionality in MVC4.
I've following code in index view.
#using (Ajax.BeginForm(
new AjaxOptions
{
HttpMethod = "get",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "resturantList"
}
))
{
<input type="search" name="searchTerm" />
<input type="submit" value="Search By Name" />
}
<div id="resturantList">
#foreach (var item in Model)
{
<div>
<h4>#item.Name</h4>
<div>#item.City, #item.Country</div>
<div>Reviews: #item.CountOfReviews</div>
<hr />
</div>
}
</div>
Following is html which renders when search button is clicked.
I've checked the script files references by firebug even they are included
<script src="/Scripts/jquery-2.1.0.js">
<script src="/Scripts/jquery-ui-1.10.4.js">
<script src="/Scripts/jquery.unobtrusive-ajax.js">
<script src="/Scripts/jquery.validate.js">
<script src="/Scripts/jquery.validate.unobtrusive.js">
Tried to remove the
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
from web.config file which solves the above stated issue but it also disables the client side validations.

Answer 1

You are not telling the form to post the data on which action of which controller, this is causing the problem,do like this, pass controller and action name as well:
#using (Ajax.BeginForm(
"Action", "Controller",
new AjaxOptions
{
HttpMethod = "get",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "resturantList"
}
))
{
<input type="search" name="searchTerm" />
<input type="submit" value="Search By Name" />
}
<div id="resturantList">
#foreach (var item in Model)
{
<div>
<h4>#item.Name</h4>
<div>#item.City, #item.Country</div>
<div>Reviews: #item.CountOfReviews</div>
<hr />
</div>
}
</div>
and second thing,make sure you are returning a partial view,if full view is returing that will also cause issues.Do this in you view for it:
#{
Layout = null
}
Actually you have to return partial view in the response of ajax call