@zahar_92

Почему не работает промис?

Всем привет!
Есть промис гуглокапчи v3. При submit на форме, вызывается функция получения токена капчи, присваивается в инпут и отправляется. Проблема в том, что при нажатии Отправить первый раз, токен присваивается, но в массиве post не передается, соответственно ошибка валидации и отправка не происходит. Если сразу же нажать второй раз, токен в input сменится и форма отправится.
1. Почему при первом нажатии в post не попадает присвоенное значение input?
2. Почему при повторном нажатии Отправить, форма отправляется, хотя токен у input меняется на новый?

Сам код
$('.js-bottom-form').submit(function(e){
    e.preventDefault();
    var formData   = new FormData($('#bottom-form')[0]);
    var $self      = $(this).first();

    var preloader  = $(this).siblings('.form-preloader');
    var inputName  = $(this).find('input[name="name"]');
    var inputPhone = $(this).find('input[name="phone"]');
    var name       = inputName.val();
    var phone      = inputPhone.val();
    
    grecaptcha.ready(function () {
      grecaptcha.execute('6LcXhlobAAAAAMj4rKvycKxrahQM9ycMn1n7bf0k', { action: 'submit' })
      .then(function (token) {
        $($self).find('input.recaptchaResponse').val(token);
        console.log(token);
      })
      .then(() => {
        console.log('готово');
      
        if (name.length < 2) {
          inputName.addClass('error');
          return false;
        } else {
          inputName.removeClass();
        }

        if (phone.length != 18) {
          inputPhone.addClass('error');
          return false;
        } else {
          inputPhone.removeClass();
        }

        $.ajax({
          url: $self.attr('action'),
          type: 'POST',
          dataType: 'json',
          headers: {
            'X-CSRF-TOKEN': $self.data('token'),
          },
          data:formData,
          cache:false,
          contentType: false,
          processData: false,
          beforeSend: function() {
            console.log(formData);
              preloader.show();
              $(this).find('input[type=submit]').prop('disabled', true);
          },
          complete: function() {
              preloader.hide();
          }
        })
        .done(function(data) {
          console.log(data);
          if (data['status']) {

            $self.find('.form__content').html('Специалист свяжется с Вами в течение 15 мин.<br><br>');
          } else {
            console.log(data);
          }
          console.log("success");
        })
        .fail(function(data) {

        })
        .always(function() {
        });
      });
    });
  });
  • Вопрос задан
  • 66 просмотров
Решения вопроса 1
sergiks
@sergiks Куратор тега JavaScript
♬♬
var formData для отправки формируется из формы сразу при нажатии отправки – в это время токен капчи ещё не получен. Добавление его в поля формы уже не влияет на сформированный ранее formData.

Ещё фигово, что валидация введённых данных делается только после капчи.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы