@if(isset($user))
    <div class="modal fade" id="editUserModal" tabindex="-1" role="dialog" aria-labelledby="createBusLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="createBusModalLabel">تعديل مدرسة</h5>
                    <button type="button" class="close" data-bs-dismiss="modal">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="edit_user_form" action="{{ route('users.update_password',$user->id) }}">
                    {{ csrf_field() }}
                    <input type="hidden" name="_method" value="PUT">
                    <div class="modal-body">
                        <div class="row">
                            <div class="col-4">
                                {{ __('general.new_password') }}
                            </div>
                            <div class="col-8">
                                <input type="password" id="e_password" name="password" class="form-control" placeholder="">
                            </div>
                        </div>
                        <div class="row mt-2">
                            <div class="col-4">
                                {{ __('general.confirm_new_password') }}
                            </div>
                            <div class="col-8">
                                <input type="password" id="e_password_confirmation" name="password_confirmation" class="form-control" placeholder="">
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn bg-gradient-success" >تعديل الحساب</button>
                        <button type="button" class="btn bg-gradient-dark" data-bs-dismiss="modal">اغلق</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endif

<script>
    $('#edit_user_form').submit(function(e) {
        e.preventDefault();
        var submit = $(this).find("[type=submit]");

        // Serialize the form data
        let form = $('#edit_user_form')[0];
        const formData = new FormData(form);
        const formAction = $(this).attr('action');
        // Send an AJAX request
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $.ajax({
            url: formAction,
            type: "POST",
            data : formData,
            dataType:"JSON",
            processData : false,
            contentType:false,

            success: function(response) {

                if (response.errors) {
                    var errorMsg = '';
                    $.each(response.errors, function(field, errors) {
                        var field_parent = $('#e_'+field).parent();
                        $.each(errors, function(index, error) {
                            // errorMsg += error + '<br>';
                            if(field_parent.hasClass( "error" ))
                            {
                                field_parent.find('.error-massage').remove( ".error-massage" );
                            }

                            field_parent.addClass('error')
                            field_parent.append(`
                                        <div class="text-danger error-massage text-right">`+error+`</div>
                                    `)
                        });
                    });
                } else {
                    $('.error-massage').remove();
                    var data = response.data;

                    toastr.success(response.success)

                    window.location.reload();
                }
            },
            beforeSend: function(){
                submit.attr("value", "Loading...");
            },
            error: function(xhr, status, error) {
                toastr.error('An error occurred: ' + error)
            }

        });
    });
</script>