repair_password.blade.php 2.45 KB
<div id="repair-password" class="modal">
    <div class="modal__body">
        <div class="modal__title left">Сбросить пароль</div>
        <div class="modal__text left">Пожалуйста, введите адрес электронной почты</div>
        <form id="repair-password-form" class="modal__sign" action="{{ route('repair_password') }}">
            <div class="modal__sign-item">
                <input type="text" class="input" name="email" id="email"
                       placeholder="Введите свой email для восстановления" required>
                <div id="email-error" class="error-message"></div>
            </div>

            <div class="modal__sign-item">
                <button id="repair-password-btn" type="submit" class="button">Отправить</button>
            </div>
        </form>
        <div class="modal__text">
            <span>Вспомнили пароль?</span>
            &nbsp;
            <a data-fancybox data-src="#sign" data-options='{"touch":false,"autoFocus":false}'>Войти</a>
        </div>
    </div>
</div>
@include('modals.successful_repair_password_sent')
<script>
    $(document).on('click', '#repair-password-btn', function (e) {
        e.preventDefault();
        const btnElm = $(this)
        const form = $('#repair-password-form');
        $.ajax({
            url: form.attr('action'),
            method: form.attr('method'),
            data: form.serialize(),
            beforeSend() {
                btnElm.attr('disabled', true)
            },
            success: function (response) {
                btnElm.attr('disabled', false)
                $.fancybox.close(true);
                $.fancybox.open({
                    src: '#repair-password-sent',
                    type: 'inline',
                    opts: {touch: false}
                });
            },
            error: function (jqXHR) {
                btnElm.attr('disabled', false)
                if (jqXHR.status === 422) {
                    let errors = jqXHR.responseJSON.errors;
                    for (let field in errors) {
                        if (errors.hasOwnProperty(field)) {
                            $(`#${field}-error`).text(errors[field][0]);
                        }
                    }
                } else {
                    alert('Произошла ошибка. Попробуйте снова.');
                }
            }
        });
    })
</script>