LARAVEL

Laravel-də ajax istifadə edərək input məlumatlarını necə təsdiqləmək olar

06.03.2021 2 dəq oxuma
@extends('front.layout.master')

@section('title')
    {{ __('home.password_recovery') }}
@endsection

@section('css')

@endsection

@section('content')
    <div class="container py-4 py-lg-5 my-4">
        <div class="row justify-content-center">
            <div class="col-lg-8 col-md-10">
                <h2 class="h3 mb-4 password-recovery-title">{{ __('home.forgot_password?') }}</h2>
                <p class="font-size-md">{{ __('home.change_your_password_in_three_easy_steps_this_helps_to_keep_your_new_password_secure') }}.</p>
                <ol class="list-unstyled font-size-md">
                    <li><span class="text-primary mr-2">1.</span>{{ __('home.fill_in_your_email_address_below') }}.</li>
                    <li><span class="text-primary mr-2">2.</span>{{ __('home.we_ll_email_you_a_temporary_code') }}.</li>
                    <li><span class="text-primary mr-2">3.</span>{{ __('home.use_the_code_to_change_your_password_on_our_secure_website') }}.</li>
                </ol>
                <div class="card py-2 mt-4">
                    <form class="card-body needs-validation" novalidate="" onsubmit="return false">
                        <div class="form-group">
                            <label for="recover-email">{{ __('home.enter_your_email_address') }}</label>
                            <input class="form-control" type="email" id="recover-email">
                            <div class="feedback" id="emailErrorRe"></div>
                        </div>

                        <div class="form-group">
                            <label for="recover-email">{{ __('home.code') }}</label>
                            <input class="form-control" type="text" id="recover-code">
                            <div class="feedback" id="codeErrorRe"></div>
                        </div>

                        <button class="btn btn-primary" id="recoveryBtn" type="button">{{ __('home.get_new_password') }}</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script>
        $(document).ready(function () {
            $('#recoveryBtn').click(function () {
                $(this).prop('disabled',true);
                $('.feedback').html('');
                let email  = $('#recover-email').val();
                let code   = $('#recover-code').val();
                if (email === '' || code === '')
                {
                    toastr.error("{{ __('toastr.incorrect_email') }}", "{{ __("toastr.attention") }}");
                    $('#recoveryBtn').prop('disabled',false);
                    return ;
                }
                $.ajax({
                    type:'POST',
                    data:{email:email,code:code},
                    url:"{!! route('password.recovery.code.post') !!}",
                    success:function (response) {
                        if (response === 'notFound')
                        {
                            toastr.error("{{ __('toastr.incorrect_email') }}", "{{ __("toastr.attention") }}");
                        }
                        else
                        {
                            alert('response')
                        }
                        $('#recoveryBtn').prop('disabled',false);
                    },
                    error: function(myErrors)
                    {
                        $.each(myErrors.responseJSON.errors, function (key, item)
                        {
                            $('#'+key+'ErrorRe').removeAttr('class').attr('class','feedback ' +
                                'recoveryErrors').html('').html(item);
                        });
                        $('#recoveryBtn').prop('disabled',false);
                    }
                })
            })
        });
    </script>
@endsection

 

Digər dildə: EN