jQuery - форма AJAX с двойным представлением

Question

Итак, у меня есть этот обработчик отправки. Когда запрос сделан, у меня есть форма, настроенная для указания URL-адреса ресурса с несколькими частями (это относится к объекту и дочернему объекту, каждый с указанными идентификаторами, как часть пути). Всякий раз, когда я отправляю форму, он не только передает запрошенный запрос, но также делает второй запрос с идентификатором и именем дочернего объекта, удаленным из URL-адреса запроса.

TL; DR: Он делает запросы к /foo/1/bar/2, затем /foo/1, и мне нужно, чтобы он не сделал второй запрос.

Я использовал стандарт event.preventDefault() и бросил в return false для хорошей меры. Не видел здесь, но я также пробовал $form.submit(false), как я видел на другом SO-ответе где-нибудь, но удалил его, так как он выглядит плохо и не работает.

function submitForm(e) { 
    e.preventDefault(); 

    var $form = $(e.target); 

    $form.find('[type="submit"], [type="button"]').prop('disabled', true); 

    var formData = { 
     // data 
    }; 

    $.ajax({ 
     url: $form.prop('action'), 
     method: ($form.find('[name="_method"]').val() || $form.prop('method')), 
     data: formData, 
     error: function(response, status) { 
      console.log(response); 
     }, 
     success: function(response, status) { 
      console.log(response); 
     }, 
     complete: function() { 
      $form.find('[type="submit"], [type="button"]').prop('disabled', false); 
     } 
    }); 

    return false; 
} 

$(document).ready(function(){ 
    $('#myform').on('submit', submitForm); 
}); 

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

Answer 1

Я не смотрел достаточно внимательно на ответы, которые я получал, потому что я был настолько повешен на то, что видел два исходящих HTTP-запроса.

Первый запрос возвращался с кодом состояния 3xx, поэтому jQuery запускал второй запрос к URL-адресу, к которому он был перенаправлен в первом ответе.

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

Answer 2

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

$(document).ready(function(){ 
    $('#myform').off('submit').on('submit', submitForm); 
}); 

Некоторые люди говорят, что вы должны использовать отвязать/связать вместе хорошей практикой. Это то же самое, но с использованием off вместо unbind.

Возможно также, что вы включили скрипт дважды в свои страницы ... проверьте это тоже!