Обратный звонок в jQuery

Question

У меня есть следующий код, который использует функцию ajaxSuccess().Проблема, с которой я сталкиваюсь, заключается в том, что всякий раз, когда запрос AJAX завершается успешно, и jQuery запускает событие the ajaxSuccess, все методы ajaxSuccess() выполняются.

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

('#drop1').on('select2:select', (e) => {
    const selectedMake = e.params.data;
    utils.emptySelect2('#drop2');
    utils.emptySelect2('#drop3');
    utils.populateSelect2(`apiURL`, '#drop2');

    $(document).ajaxSuccess(() => {
        $('#drop3').select2('close');
        $('#drop2').select2('open');
    });
});

AJAX вызов:

populateSelect2(url, element, key) {
    $.get(url)
        .done((res) => {
            if (res) {
                let data = $.map(key ? res[key] : res, (obj) => {
                    obj.text = obj.name;
                    return obj;
                });
                data = sortBy(data, 'name');

                $(element).select2({
                    placeholder: 'please enter',
                    data
                });
            }
        })
        .fail(() => {
            this.showError(`Failed to call ${url}`);
        });
}

Answer 1

Если я вас правильно понял, вы можете сделать что-то вроде этого:

('#drop1').on('select2:select', (e) => {
    const selectedMake = e.params.data;
    utils.emptySelect2('#drop2');
    utils.emptySelect2('#drop3');
    utils.populateSelect2(
        `apiURL`,
        '#drop2',
        // success callback
        (res) => console.log(res),
        // fail callback
        () => console.log(fail)
    );

    $(document).ajaxSuccess(() => {
        $('#drop3').select2('close');
        $('#drop2').select2('open');
    });
});

populateSelect2(url, element, key, success, fail) {
    $.get(url)
        .done((res) => {
            // ...

            success(res);
        })
        .fail(() => {
            // ...

            fail();
        });
}

Answer 2

Внутри utils.populateSelect2 метода вы будете вызывать ajax-вызовы для получения данных.Там вы можете поддерживать успешные или неудачные обратные вызовы.Если вы непосредственно присоединяете метод ajaxSuccess к объекту документа, то для всех последующих вызовов ajax будет вызываться ваш метод ajaxSuccess.

 $.ajax({
        url: '??',
        dataType: '??',
        success: function (data, status) {
            console.log(data.responseText);
        },
        error: function(jqXHR, textStatus, errorThrown) {
        }
    })

Answer 3

jQuery фрагмент вызова ajax.Зарегистрируйте успешный и обратный вызов ошибки для получения ответа API.

$.ajax({
    type: 'GET',
    url: "https://reqres.in/api/users/2",
    dataType:"json",
    success: function(data){
            console.log("success");    
    },
    error:function(error){
        console.log("error");
    }
      });

Answer 4

Когда вы используете JQuery.ajaxSuccess (), вы «ловите» все запросы, сделанные из вашего браузера.Если вы хотите получить ответ, в частности, от одного вызова (что часто имеет место), вам необходимо использовать обратный вызов.

Например:

$.ajax({
        type:"POST",
        url:"/myUrl"
        success:function(data){
            alert(data);
        }
    });

Параметр «data», имеющийответ от сервера.

PS: Вы можете заменить ваш успешный обратный вызов любой функцией, которую хотите использовать