Prevent Double submit jquery validation ajax

Question

Я использую jquery.validate.js для проверки своей формы, запрос, который я использую, работает, все работает там одна вещь, которую я не могу найти для этого исправления

<div id="form"> 
    <form> 
     <div class="form-group"> 
     Input, radio, textarea 
     </div> 
     <div class="form-group"> 
      <button class="btn btn-black" id="next">Continue</button> 
     </div> 
    </form> 
</div> 

, когда пользователь нажимает на Continue формы получает подтверждено и «представляются», дело в том, что мне не нужно, чтобы отправить форму еще раз, чтобы предотвратить роды, что я сделал следующее:

$().ready(function() { 
    var validator = $("#packs").bind("invalid-form.validate", function() { 
     $("#summary").html("Erros"); 
    }).validate({ 
     debug: false, 
     errorElement: "em", 
     errorContainer: $("#warning, #summary"), 
     errorPlacement: function(error, element) { 
      error.appendTo(element.parent("div")); 
     }, 
     success: function(label) { 
      label.text("ok!").addClass("success flosts"); 
     }, 
     submitHandler: function (form) { 
      $("#enviaforms").fadeOut("slow"); 
      $("#rebvs").fadeIn("slow"); 
      $("#revisa").click(function(){ 
       $("#rebvs").fadeOut("slow"); 
       $.ajax({ 
        type: $(form).attr('method'), 
        url: $(form).attr('action'), 
        data: $(form).serialize(), 
        dataType : 'json', 
        cache: false, 
        success: function(){ 
         $("#respuesta").fadeIn("slow"); 
        }, 
        error: function(){ 
         console.log(); 
         alert("Error please try again..."); 
        } 
       }).done(function (data) { 
        if (data.sts == true) { 
         $(".loading").fadeOut("slow"); 
         $("#enviaforms").fadeOut("slow"); 
         $("#respuesta").html(data.datas.valids); 
         // $(form).reset(); 
         // alert(data.datas.valids); 
        } else { 
         $(".loading").fadeOut("slow"); 
         alert('fail'); 
        } 
       }); 
       return false; 
      }); 
      $("#editar").click(function(){ 
       $("#enviaforms").fadeIn("slow"); 
       $("#rebvs").fadeOut("slow"); 
       return false; 
      }) 
     }, 
     rules: { ... }, 
     messages: {...} 
    }); 
    }); 

Если вы заметили мою функцию submitHandler, у меня есть другой идентификатор, что он делает, скройте e form и показать другой div вне формы со всеми персональными данными пользователей и другими настройками для просмотра пользователем, на этом другом div у меня есть две кнопки, можно было бы фактически отправить форму, но помните, что кнопки находятся вне формы
Отправить форму и изменить форму, эти две кнопки находятся за пределами формы, и я вызываю ее с помощью функции .click() ... если пользователь нажимает кнопку «Изменить форму», она скрывает обзор div и показывает форму, когда пользователь нажмите кнопку отправки, чтобы отправить форму через ajax.
Резюме: нажмет пользователь сделал представить образование ..

[Заполните форму] Продолжить -> [форма обзор все ок] Отправить форму = Совершенное исполнение, мы все счастливы ...

[Form] Продолжить -> [назад, чтобы изменить форму] редактировать форму -> [После редактирования] Продолжить -> [все ок] Отправить форму = Не хорошо, это отправить двойной представить ... :(

Итак, вопрос в том, как предотвратить двойную отправку только когда пользователь вернется к редактированию, а затем вернется к обзору, а затем отправьте форму ...

Я думаю, что проблема заключается в кнопке «продолжить», поскольку она нажата дважды, но как я могу проверить форму без это? ... Если я использую тег A для перехода к следующему этапу, форма не будет полностью проверена, если форма имеет ошибку, и к тому времени, когда пользователь нажимает кнопку отправки, уверен, что она вызовет некоторые ошибки, но пользователь не увидит их, так как ошибки находятся внутри формы и к тому времени форма скрыта, поэтому никаких ошибок не видно, и мне нужно показать какую-либо ошибку раньше всего ...

Любая помощь будет принята с благодарностью.

Answer 1

Вы можете использовать метод валидатора .valid(), чтобы проверить, действительна ли ваша форма, не отправив его.

validator.valid();// it will check if all your fields are valid without submitting anything.

Оттуда рабочий процесс может продолжаться, как вы, как отправка формы, когда вы любите.