Для начала нам нужны скрипты:
<script src="~/Scripts/jquery-1.8.2.min.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
Для того чтобы это все заработало нам нужна Ajax форма:
@using (Ajax.BeginForm("ActionName", new AjaxOptions
{
HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "ajaxDiv",
}))
{
<div id="ajaxDiv">
@{Html.RenderPartial("~/Views/News/Control.cshtml", new Model.TestModel(true));}
</div>
}
Немного подробнее. Я использую имя действия – которое мне возвращает сформированный Partial View. В AjaxOption я указываю HttpMetod, InsertionMode – это способ вставки, можно заменить, добавить в начало, и в конец блока, UpdateTargetId – это имя контейнера в котором должны быть отображены данные. В самом теле формы нужно разместить контрол который будет вызывать submit формы. В моем случае я перегружаю полностью весь контрол, методами вызванными из самого контрола, по этому я его и разместил в форме.
Можно сделать и так:
@using (Ajax.BeginForm("GetData", new AjaxOptions
{
HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "ajaxDiv",
}))
{
<input type="submit" value="Загрузить" />
}
<div id="ajaxDiv">
@{Html.RenderPartial("~/Views/News/Control.cshtml", new Model.TestModel(true));}
</div>
В контроллере для Ajax у меня есть Action:
[HttpPost]
public ActionResult GetData()
{
Model.TestModel model = new Model.TestModel();
return PartialView ("~/Views/News/Control.cshtml", model);
}
В моем случае он возвращает Partial View который и записывается в div – "ajaxDiv"
А что делать если нужно передавать параметры? Для этого нужно указать их в параметре routeValues:
@Ajax.ActionLink(, "MonuthChange",
new { Param1 = Model.Param1, Param2 = Model.Param2 }, new AjaxOptions
{
HttpMethod = "POST",
InsertionMode = InsertionMode.Replace,
UpdateTargetId = "calendar"
}, new { @class = "active" })
А в контроллере:
public ActionResult GetData(string Param1, int Param2)
{
Model.TestModel model = new Model.TestModel();
return PartialView ("~/Views/News/Control.cshtml", model);
}
Интересный момент, чтобы контролы могли отправить Ajax форму или запрос, нужно использовать котролы не из @Html а из @Ajax.