Разница между JsonResult и ajax.BeginForm

Question

Я пытаюсь понять разницу между работой JsonResult и Ajax.BeginForm? Может ли кто-то быть любезным, чтобы привести примеры каждого? Может ли функциональность каждого быть выполнена JQuery? Если да, то как?

Спасибо

Answer 1

JsonResult - это всего лишь производный класс ActionResult, который указывает, что это действие будет возвращать JSON вместо представления или чего-то еще.

Например:

public ActionResult Foo()
{
    var model = new MyViewModel
    {
        Foo = "bar"
    };
    return Json(model);
}

При вызове этого действия контроллера возвращается сериализованное представление JSON модели:

{"Foo":"bar"}

. Кроме того, для заголовка ответа HTTP Content-Type устанавливается значение application/json.

Ajax.BeginForm - это помощник HTML, используемый для генерации элемента <form>, но который будет отправлен на сервер с помощью AJAX.Поэтому, если вы укажете эту форму на действие контроллера, возвращающее JSON, вы сможете получить результаты этого JSON в обратном вызове success.Результаты будут автоматически проанализированы в объект javascript, к которому вы можете получить доступ к его свойствам.

Например:

@using (Ajax.BeginForm("foo", "home", new AjaxOptions { OnSuccess = "onSuccess" }))
{
    @Html.EditorFor(x => x.SomeProperty)
    <button type="submit">OK</button>
}

Это создаст элемент <form>, который будет отправлять запрос AJAX, когдаотправлено на действие Foo.Чтобы это работало, вам нужно включить на свою страницу следующий скрипт:

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>

Теперь осталось только написать эту onSuccess функцию javascript и обработать результаты JSON, возвращаемые сервером:

<script type="text/javascript">
    var onSuccess = function(result) {
        alert(result.Foo);
    };
</script>

---

Может ли функциональность каждого из них выполняться JQuery?

За кулисами, когда вы включаете jquery.unobtrusive-ajax.js, все формы или ссылки, которые были созданы с помощьюAjax.* помощники будут автоматически проанализированы и AJAXified с jQuery.Атрибуты HTML5 data-*, сгенерированные этими помощниками, будут обработаны и превращены в вызовы AJAX.

Конечно, вы можете решить использовать простой jQuery и ни одного из Ajax.* помощников.В этом случае вам не нужно включать скрипт jquery.unobtrusive-ajax.js.Вам не нужно использовать никаких помощников Ajax. *.

Для генерации формы вы можете использовать обычный Html.BeginForm помощник:

@using (Html.BeginForm("foo", "home", FormMethod.Post, new { id = "myform" }))
{
    @Html.EditorFor(x => x.SomeProperty)
    <button type="submit">OK</button>
}

, а затем в javascript-файле использовать jQuery, чтобы подписаться на событие .submit этой формы, отменитьсинхронная отправка по умолчанию, возвращая false и отправляя вместо этого запрос AJAX:

$(function() {
    $('#myform').submit(function(){
        $.ajax({
            url: this.action,
            type: this.method,
            data: $(this).serialize(),
            success: function(result) {
                alert(result.Foo);
            }
        });
        return false;
    });
});