Всем привет!
Есть промис гуглокапчи 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() {
});
});
});
});
