Проверка Jquery Validate запускается дважды непреднамеренно (должно быть только один раз) - PullRequest
0 голосов
/ 03 июля 2019

У меня есть форма с входным файлом, я сериализовал входные данные вручную и запустил метод проверки Jquery Validate для проверки содержимого и последующего выполнения вызова Ajax для отправки, в этом случае я использую составные формданные.

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

Вот как я запускаю метод проверки, поэтому япоместите метод в функцию, которая срабатывает каждый раз, когда я открываю определенный модал.

Это следующие функции, которые происходят во время открытия модала и после его скрытия.

$("#ModalUpdateInsert").on("show.bs.modal", function (event) {
      var SubmitType = $('#SubmitType').val();
      if(SubmitType == "new"){
         $('#btnUpdate').detach().appendTo('.temp_hidden');
         $('#btnSave').detach().appendTo('.temp_append_to');
      }
      else if(SubmitType == "update"){
         $('#btnSave').detach().appendTo('.temp_hidden');
         $('#btnUpdate').detach().appendTo('.temp_append_to');
      }
      validate_start_function();
});
$('#ModalUpdateInsert').on('hide.bs.modal', function (event) {
      $form = $('form');
      $validator = $form.validate(); //init validator
      $validator.resetForm();
      $form.find('.control-group').removeClass('.error'); 
      $form.find('.has-error').removeClass("has-error");
      $form.find('.has-success').removeClass("has-success");
      $form.find('.form-control-feedback').remove();
});

Это моя функция проверки:

function validate_start_function(){
/// ... custom regex validation
   var validate_start = $("#RegisterMerchant").validate({
      rules: {
         /// ... custom rules rules
      },
      messages: {
         /// ... custom messages
      },
      highlight: function (element, errorClass) {
         /// ... highlight add error class for the input label
      },
      unhighlight: function (element, errorClass) {
         /// ... highlight remove error class for the input label
      },
      errorElement: 'span',
      errorClass: 'help-block',
      errorPlacement: function (error, element) {
         error.css({
            'font-size': '10px',
            'display': 'inline'
         });
         if (element.parent('.input-group').length) {
            error.insertAfter(element.parent());
         }
     else {
        error.insertAfter(element);
     }
      },
      submitHandler: function (form, event_submit) {
         event_submit.preventDefault();
         var input_parameter = {};
         input_parameter.MerchantID = $('#txtMerchantID').val();
         input_parameter.PhoneNumber = $('#txtPhone').val();
         input_parameter.Email = $('#txtEmail').val();
         input_parameter.Password = $('#txtPassword').val();
         input_parameter.StoreName = $('#txtMerchantName').val();
         //input_parameter.StorePhoneNumber = $('#txtPhone').val();
         input_parameter.StoreAddress = $('#txtAddress').val();
         input_parameter.StoreAddressNote = $('#txtAddressNote').val();
         input_parameter.StoreDescription = $('#txtDescription').val();
         input_parameter.StoreOpenTime = $('#txtOpenStore').val();
         input_parameter.StoreCloseTime = $('#txtCloseStore').val();
         input_parameter.Latitude = $('#txtLat').val();
         input_parameter.Longitude = $('#txtLong').val();
         input_parameter.OwnerFullName = $('#txtOwnerName').val();
         input_parameter.OwnerBirthDate = $('#txtBirthDate').val();
         //input_parameter.OwnerPhoneNumber = $('#txtPhone').val();
         input_parameter.Gender = $('#slGender').val();
         console.log(input_parameter);

         var formData = new FormData();
         formData.append('json', JSON.stringify(input_parameter));
         if (($("#InputFile"))[0].files.length > 0) {
            formData.append('file', $('#InputFile')[0].files[0]);
         }
         //console.log(formData);

         alert("submit");
         var url = "";
         if($('#SubmitType').val() == 'new'){
            url = url_local+"/insertmerchant";
         }
         else{
            url = url_local+"/updatemerchantweb";
         }

         $.ajax({
            url : url,
            type: 'POST',
            enctype: 'multipart/form-data',
            processData: false,
            contentType: false,
            data: formData,
            beforeSend: function() {
               $('#wait').show();
            },
         }).done(function (data) {
            $('#ModalUpdateInsert').modal('hide');
            $('#wait').show();
            datatable.ajax.reload();
         }).fail(function (jqXHR, textStatus) {
            console.log("failed " + jqXHR + " " + textStatus);
            datatable.ajax.reload();
         });

         return false;
      },
      invalidHandler: function (event, validator) {
         var errors = validator.numberOfInvalids();
         console.log("error " + errors);
      }
   });

   validate_start.resetForm();
}

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...