Перехватить форму submit with jQuery

Я хочу перехватить отправку через jQuery и сначала проверить, присутствует ли файл на сервере. Если он присутствует, продолжайте с запросом, если не отобразите сообщение и не отправите запрос. Это то, что у меня есть:

$("#methodForm").submit(function(e){

    checkIndex('upload/segments.gen').done(function() {
        return true;
    }).fail(function () {
        e.preventDefault();
        alert("No index present!");
        return false;
    });
});

это checkIndex():

function checkIndex(file){
    return $.ajax({
        url : file,
        type:'HEAD'
    });
}

Что происходит: файл присутствует на сервере, но checkIndex возвращается с ошибкой. Сначала я вижу всплывающее окно предупреждения, а затем оно продолжается и отправляет почтовый запрос на сервер.

Я использую checkIndex() для других целей, а также там, где он работает, как ожидалось, поэтому я уверен, что ошибка находится где-то в процедуре отправки. Но я не могу понять, что с ним не так.

Ответ 1

Вы не можете вернуться из обратного вызова к асинхронному методу (например, ajax). Вместо этого запретите отправку всех вместе, а затем отправьте ее, когда вы будете готовы.

$("#methodForm").submit(function(e){
    e.preventDefault();
    var form = this;
    checkIndex('upload/segments.gen').done(function() {
        form.submit(); // submit bypassing the jQuery bound event
    }).fail(function () {
        alert("No index present!");
    });
});

Ответ 2

Это действительно не работает, checkIndex является асинхронным, поэтому к тому времени, когда он возвращает что-либо, форма отправляется, а операторы return также находятся в другой области, попробуйте что-то более похожее на это:

$("#methodForm").submit(function(e){
    e.preventDefault(); //prevent submit
    var self = this;
    checkIndex('upload/segments.gen').done(function() {
        self.submit(); //submit if ajax OK
    }).fail(function () {
        alert("No index present!");
   });
});