Добрый день. Суть такова:
Есть кнопка, при нажатии на которую выполняется ajax на отправку смски для подтверждения регистрации и тут же открывается модалка с полем для ввода этой смски. Внутри модали помимо поля для ввода смс сабмит кнопка для подтверждения, которая отправляет форму. Здесь все ок.
Понадобилось в этой же модалке добавить кнопку на запрос новой смски с таймером. При клике по кнопке надо просто выполнить ajax в контроллер и перегенерить некоторые даннные, но проблема в том, что по клику по этой кнопке вместо выполнения ajax-запроса получаю редирект на предыдущую страницу.
Я так понимаю модалка не особо дружит с аяксом внутри. Как можно поправить это действие, чтобы по клику на "Выслать новый код" на странице ничего не менялось, а просто выполнялся ajax?
В коде ничего нового - бутстраповская модалка и событие onclick с аяксом на кнопке повторной отправки кода.
Modal::begin([
'header' => '<div class="common__board-title-big" style="text-align: center; font-size: 18px">На указанный номер отправлено смс с проверочным кодом. Введите полученный код в поле ниже. </div>',
'toggleButton' => [
'label' => 'Зарегистрироваться',
'tag' => 'button',
'class' => 'guest__btn_submit modal-register register',
],
]);
?>
<div class="m-b-15 row">
<div class="col-md-12 common__board-col" style="padding-left:30%; padding-right: 30%">
<div class="form-group highlight-addon has-success">
<?= Html::hiddenInput('hash-code', $hash_code, ['class' => 'hash-code']) ?>
<?= Html::input('text', 'code', '', ['class' => 'modal-input', 'style' => "font-size: 25px; padding: 5% 20%; text-align: center;"]) ?>
</div>
<div class="form-group">
<?= Html::submitButton('Отправить', ['class' => 'btn-n-brd-lblue__fill send-button register']) ?>
</div>
<div class="form-group">
<?= Html::button('Получить новый код', ['class' => 'btn-n-brd-lblue__fill get_new_code', 'style' => 'display: none']) ?>
<div id="timerBlock" class="common__board-title-big" style="text-align: center; font-size: 15px">
<p>Перезапросить код через <span class="seconds"> 10 </span> секунд</p>
</div>
</div>
</div>
</div>
<?php Modal::end(); ?>
$('.get_new_code').on('click', function(event) {
//event.preventDefault();
var number = $('#profile-phone').val();
var hash = $('.hash-code').val();
$.ajax({
url: '/registration/generate-new-hash',
type: 'POST',
data: {number : number, hash : hash},
success: function(res){
console.log(res);
},
error: function(xhr, status, error){
console.log(error);
}
});
})