Jquery Ajax beforeSend и успех, ошибка и полная

У меня есть проблема в ajax-функции, где beforeSend второго сообщения ajax выполняется перед полной: функцией первого ajax. Класс загрузки, который я добавляю в placehorder перед отправкой, работает для первого вызова ajax. Однако вскоре после завершения первого запроса ajax класс будет удален и никогда не будет добавлен снова на второй и дальнейшие вызовы (помните рекурсивные вызовы). Во время отладки это показывает, что функция beforeSend вторых вызовов ajax вызывается сначала, а полная функция первого вызова ajax вызывается позже. Это очевидно, потому что возвращаемые данные, вставленные на страницу с первого вызова ajax, запускают второй вызов.

Короче это перепутало. Можно ли это изменить?

Код функции выглядит следующим образом

function AjaxSendForm(url, placeholder, form, append) {
var data = $(form).serialize();
append = (append === undefined ? false : true); // whatever, it will evaluate to true or false only
$.ajax({
    type: 'POST',
    url: url,
    data: data,
    beforeSend: function() {
        // setting a timeout
        $(placeholder).addClass('loading');
    },
    success: function(data) {
        if (append) {
            $(placeholder).append(data);
        } else {
            $(placeholder).html(data);
        }
    },
    error: function(xhr) { // if error occured
        alert("Error occured.please try again");
        $(placeholder).append(xhr.statusText + xhr.responseText);
        $(placeholder).removeClass('loading');
    },
    complete: function() {
        $(placeholder).removeClass('loading');
    },
    dataType: 'html'
});
}

И данные содержат следующий фрагмент javascript/jquery, который проверяет и запускает другой запрос ajax.

<script type="text/javascript">//<!--
 $(document).ready(function() {
    $('#restart').val(-1)
    $('#ajaxSubmit').click();
});
//--></script>

Ответ 1

Возможно, вы можете попробовать следующее:

var i = 0;
function AjaxSendForm(url, placeholder, form, append) {
var data = $(form).serialize();
append = (append === undefined ? false : true); // whatever, it will evaluate to true or false only
$.ajax({
    type: 'POST',
    url: url,
    data: data,
    beforeSend: function() {
        // setting a timeout
        $(placeholder).addClass('loading');
        i++;
    },
    success: function(data) {
        if (append) {
            $(placeholder).append(data);
        } else {
            $(placeholder).html(data);
        }
    },
    error: function(xhr) { // if error occured
        alert("Error occured.please try again");
        $(placeholder).append(xhr.statusText + xhr.responseText);
        $(placeholder).removeClass('loading');
    },
    complete: function() {
        i--;
        if (i <= 0) {
            $(placeholder).removeClass('loading');
        }
    },
    dataType: 'html'
});
}

Таким образом, если оператор beforeSend, если он вызывается перед оператором complete i, будет превышать 0, поэтому он не удалит класс. Тогда только последний вызов сможет удалить его. Я не могу проверить это, дайте мне знать, работает ли это или нет.

Ответ 2

На самом деле это намного проще с API-интерфейсом jQuery:

$.ajax(
            type: "GET",
            url: requestURL,
        ).then((success) =>
            console.dir(success)
        ).failure((failureResponse) =>
            console.dir(failureResponse)
        )

В качестве альтернативы вы можете передавать функции bind для каждого обратного вызова результата; порядок параметров: (success, failure). Пока вы указываете функцию с хотя бы одним параметром, вы получаете доступ к ответу. Так, например, если вы хотите проверить текст ответа, вы можете просто сделать:

$.ajax(
            type: "GET",
            url: @get("url") + "logout",
            beforeSend: (xhr) -> xhr.setRequestHeader("token", currentToken)
        ).failure((response) -> console.log "Request was unauthorized" if response.status is 401