Добрый день.
Есть форма с отправкой данных с помощью ajax.
Как сделать ресет формы после нажатия на кнопку "отправить"? (При успешной отправке success)
Перепробовал все возможные варианты в разные места, не получается, форма не очищается, на кнопке висит загрузка отправки до перезагрузки страницы. При этом все отправляется нормально.
Следующие варианты пробовал:
document.getElementById('xxx').reset();
$('#xxx').get(0).reset();
$("#btn-xxx").click(function() {
$("#xxx")[0].reset();
});
и другое (xxx это id-шники мои)
Вот код изначальный вариант без ресета:
function sendForm(fromSend, btn){
var btn_old = btn.html();
$.ajax({
url:'thankyou.php',
type:'post',
data:fromSend,
beforeSend:function (){
btn.html('<div class="lds-ellipsis"><div></div><div></div><div></div><div></div></div>');
},
success:function (data){
if ($('.form-panel.formsAnim').length > 0) {
$('.form-panel').removeClass('formsAnim');
setTimeout(function (){
$('.form').removeClass('showForm');
$('.form-panel').addClass('formsAnim');
$('.thanks').addClass('showForm');
},300);
}else{
$('.forms__bg').fadeIn(300).css('display', 'flex');
$('.thanks').addClass('showForm');
$('.form-panel').addClass('formsAnim');
}
if (fromSend['title'] == 'Заказ звонка'){
ym(70264090,'reachGoal','call');
gtag('event', 'call', {
'event_category': 'lead',
});
}else if (fromSend['title'] == 'Заявка на получение прайс-листа'){
ym(70264090,'reachGoal','price');
gtag('event', 'price', {
'event_category': 'lead',
});
window.open('/upload/price.pdf');
}else if (fromSend['title'] == 'Заявка на покупку товара'){
ym(70264090,'reachGoal','order');
gtag('event', 'order', {
'event_category': 'lead',
});
}else if (fromSend['title'] == 'Заявка на получение промокода'){
ym(70264090,'reachGoal','discount');
gtag('event', 'discount', {
'event_category': 'lead',
});
}else if (fromSend['title'] == 'Заявка с блока Остались вопросы?'){
ym(70264090,'reachGoal','question');
gtag('event', 'question', {
'event_category': 'lead',
});
}else if (fromSend['title'] == 'Заказ на получение консультации'){
ym(70264090,'reachGoal','consult');
gtag('event', 'consult', {
'event_category': 'lead',
});
}else if (fromSend['title'] == 'Заказ звонка'){
ym(70264090,'reachGoal','form-phone');
gtag('event', 'form-phone', {
'event_category': 'lead',
});
}
btn.html(btn_old);
},
error: function (request, status, error){
console.log(request.responseText);
}
});
}
Форма в html:
<form class="form form-phone" >
<div class="form__title">Оставьте свои контактные данные</div>
<div class="form__group">
<div class="form__inp-label">Ваше имяшко</div>
<input class="form__input" name="name" type="text" required>
<div class="form__inp-label">Номер телефона</div>
<input class="form__input" name="phone" placeholder="+7 (___) ___-__-__" type="text" required>
</div>
<div class="btn" data-form="thanks" data-check="true">Отправить</div>
<div class="form__rules">Нажимая на кнопку, вы даете согласие <br>на <a target="_blank"
href="privacy.html">обработку
персональных данных</a></div>
</form>
вот так до обновления страницы, ну то есть форма успешно отправляется, но при повторном открытии не обновляется до перезагрузки страницы
