Отображение частичного представления или действия контроллера попадания при проверке из вызова ajax

У меня есть следующий вызов ajax:

    $.ajax({
                    url: "@Url.Action("GetMatch", "Test")",
                    data: {
                        Name: $("[name='Name']").val(),
                        Surname: $("[name='Surname']").val(),
                        Email: $("[name='Email']").val(),
                    },
                    dataType: "text",
                    type: "POST",
                    success: function (data, textStatus, jqXHR) {
                        alert(data.length);
                        if (data.length <= 13){
                            SaveQuote();
                        } else {
                            alert("matche")
                            }
});

Действие GetMatch в контроллере показано ниже:

[HttpPost]
public ActionResult GetClientMatch(ClientBusinessModel contactPerson)
{
    *search for a list*
    if (list.Count > 0)
    {
        return PartialView("~/Views/Shared/Partials/_Client.cshtml", list);
    } else
        return Json(new { data = contactPerson }, JsonRequestBehavior.AllowGet);
}

Что я хочу сделать, так это в случае успеха, если список не пуст, отобразить частичное представление _Client.cshtml. Хорошо. Но если список пуст, вызовите другое действие контроллера:

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult CreateClient(SchoolModel school, ClientBusinessModel contactPerson, long QuotationId, long LeadId)
{
    *some aciotns*
}

Во-первых, как проверить, являются ли данные, возвращенные при вызове ajax к действию GetClientMatch, частичным представлением или contactPerson? Прямо сейчас я провожу тест на длину данных. А также как сохранить данные формы и contactPerson, возвращенные первым вызовом ajax?

Моя функция SaveQuote:

function SaveQuote() {
        var obj = $('#frmSchool').serialize();
        var jsonObj = @Html.Raw(Json.Encode(Model));
        $.ajax({
                 type: "POST",
                 url: "@Url.Action("CreateClient", "Test")",
                 data: obj + "
                            Name: $("[name='Name']").val(),
                            Surname: $("[name='Surname']").val(),
                            Email: $("[name='Email']").val(),
                 success: function (data) {
                     $('#ProductInformation').html(data);
                 },
                 error: function (xhr, status, error) {
                     alert(error);
                 }
             });
    }

Как я могу выполнить действие контроллера с данными формы и моделью contactPerson, когда список, возвращенный в первом вызове ajax, пуст?

Подсказка: вам нужно использовать serializeArray() вместо serialize(), чтобы иметь возможность передавать дополнительные данные. Отправленные данные могут быть отправлены тем же способом, что и serialize().

Tetsuya Yamamoto 10.08.2018 13:56

@TetsuyaYamamoto: Как я могу использовать serializeArray () для данных формы и модели?

refresh 10.08.2018 13:59

Просто используйте var obj = $('#frmSchool').serializeArray(); и используйте серию методов obj.push() для добавления дополнительных данных. Затем используйте свойство data в вызове AJAX, например data: obj.

Tetsuya Yamamoto 10.08.2018 14:02
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
0
3
32
1

Ответы 1

Вместо использования serialize() для сериализации формы вам необходимо использовать serializeArray(), который позволяет отправлять дополнительные данные перед назначением функции обратного вызова AJAX, как в следующем примере (см. Связанную проблему здесь):

function SaveQuote() {
    var obj = $('#frmSchool').serializeArray();

    // pushing additional data to existing array
    obj.push({ name: "Name", value: $("[name='Name']").val() });
    obj.push({ name: "Surname", value: $("[name='Surname']").val() });
    obj.push({ name: "Email", value: $("[name='Surname']").val() });

    var jsonObj = @Html.Raw(Json.Encode(Model));
    $.ajax({
        type: "POST",
        url: "@Url.Action("CreateClient", "Test")",
        data: obj,
        success: function (data) {
            $('#ProductInformation').html(data);
        },
        error: function (xhr, status, error) {
            alert(error);
        }
    });
}

Кроме того, если вы хотите проверить, возвращает ли ответ частичное представление или ответ JSON, содержащий contactPerson, установите условие if для проверки существования указанного ключа объекта:

Контроллер

[HttpPost]
public ActionResult GetClientMatch(ClientBusinessModel contactPerson)
{
    // *search for a list*
    if (list.Count > 0)
    {
        return PartialView("~/Views/Shared/Partials/_Client.cshtml", list);
    } 
    else
    {
        // key name intentionally changed for disambiguation
        return Json(new { contact = contactPerson }, JsonRequestBehavior.AllowGet);
    }
}

jQuery

function SaveQuote() {
    var obj = $('#frmSchool').serializeArray();
    obj.push({ name: "Name", value: $("[name='Name']").val() });
    obj.push({ name: "Surname", value: $("[name='Surname']").val() });
    obj.push({ name: "Email", value: $("[name='Surname']").val() });

    var jsonObj = @Html.Raw(Json.Encode(Model));
    $.ajax({
        type: "POST",
        url: "@Url.Action("CreateClient", "Test")",
        data: obj,
        success: function (data) {
            // check if contact person exists
            if (data.contact == undefined) {
                // returns partial view
                $('#ProductInformation').html(data);
            }
            else {
                // call another action here, e.g. create client function
                createClient(data.contact, ...);
            }
        },
        error: function (xhr, status, error) {
            alert(error);
        }
    });
}

Метод вызова другого действия зависит от атрибута действия, установленного в этом действии (метод GET / POST), и требуемых параметров для передачи с этим действием.

Другие вопросы по теме