Нужен совет по потоку моей формы AJAX в MVC

Question

Мне нужна помощь / руководство по написанию AJAX-части моего приложения.

У меня есть кнопка, при нажатии которой появляется модальное диалоговое окно.В диалоговом окне у меня есть форма Ajax, в которой есть текстовое поле и кнопка для сохранения значений:

@using( Ajax.BeginForm("SaveText", new AjaxOptions{ OnSuccess = "ajaxSuccess" }) )
{
    @Html.TextBoxFor(m => m.Text)

    <p>
        <input type="submit" value="Save" />
    </p> 
}

Когда AJAX завершит работу успешно, я хочу закрыть диалоговое окно и обновить сетку на главной странице:

function ajaxSuccess() {
    closeDialog();
    refreshGrid();
}

Я столкнулся с проблемами при попытке реализовать проверку.Я не совсем уверен, как достичь того, чего я хочу.Вот мой контроллер:

public ActionResult SaveText(SaveTextViewModel model)
{
    if( ModelState.IsValid )
    {
        return PartialView("SaveTextPartial", model);
    }

    repository.SaveText(...);

    return PartialView("SaveTextPartial");
}

Вот где я испытываю трудности: когда я отправляю форму и возникают ошибки проверки, контроллер возвращает частичное представление, но метод AJAX OnSuccess завершается.Я не знаю, как отличить успех с ошибками и успех без ошибок.Когда у меня возникают ошибки валидации, моя форма закрывается, а сетка обновляется, а это не то, чего я хочу.

У кого-нибудь есть идеи?Нужно ли мне реструктурировать весь поток моего вызова AJAX или сделать его совершенно другим?

Answer 1

Похоже, вам не нужна эта форма для работы без Javascript (так как вы всегда возвращаете частичное представление), так почему бы не в случае успеха вернуть простой объект JSON?

return Json(new { success = true })

А если есть ошибка, верните частичное представление, чтобы вы могли заменить HTML.

Затем проверьте это в вашем обратном вызове ...

if (result.success) { }

Таким образом, в случае успеха вы можете безопасно закрыть диалоговое окно, но в случае ошибки проверки вы заменяете его HTML-кодом на HTML-код, полученный вами по запросу AJAX.

Я не знаю, какие параметры доступны для вашего обратного вызова onSuccess, но я уверен, что тело ответа является одним из них.

Answer 2

Вы можете добавить собственный заголовок HTTP в случае ошибки:

public ActionResult SaveText(SaveTextViewModel model)
{
    if( !ModelState.IsValid )
    {
        // a validation error occurred
        Response.AppendHeader("X-Error", "true");
        return PartialView("SaveTextPartial", model);
    }

    repository.SaveText(...);

    return PartialView("SaveTextPartial");
}

и на клиенте:

function ajaxSuccess(e, status, xhr) {
    if (xhr.getResponseHeader('X-ERROR')) {
        alert('failure');
    } else {
        alert('success');
    }
}