{{-- Modal --}}
<div class="modal fade" id="editEducationDetailsModal" tabindex="-1" aria-labelledby="educationDetailsModal" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h1 class="modal-title fs-5" id="editEducationDetailsModal">Edit Education Details</h1>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form action="" method="POST" id="edit_education_details_form"
                    enctype="multipart/form-data">
                    @csrf
                    {{-- {{ dd($educationDetails) }} --}}
                    <input type="hidden" name="education_id" id="edit_education_id">

                    <div class="row g-3">
                        <div class="col-md-6">
                            <label class="form-label">Qualification</label>
                            <select name="qualification_id" id="edit_qualification" class="form-select">
                                <option value="">Select Qualification</option>
                                @foreach ($qualifications as $q)
                                    <option value="{{ $q->id }}">{{ $q->name }}</option>
                                @endforeach
                            </select>
                        </div>

                        <div class="col-md-6">
                            <label class="form-label">Board/University</label>
                            <input type="text" name="board" id="edit_board" class="form-control">
                        </div>

                        <div class="col-md-6">
                            <label class="form-label">Institution</label>
                            <input type="text" name="institution" id="edit_institution" class="form-control">
                        </div>

                        <div class="col-md-6">
                            <label class="form-label">Year of Passing</label>
                            <input type="number" name="year" id="edit_year" class="form-control" min="1980" max="2024"
                            >
                        </div>

                        <div class="col-md-6">
                            <label class="form-label">Percentage/Grade</label>
                            <input type="text" name="grade" id="edit_grade" class="form-control">
                        </div>

                        <div class="col-md-6">
                            <label class="form-label">Upload Document</label>
                            <input type="file" name="file" class="form-control">
                        </div>
                        
                    </div>

                    <div class="text-center mt-4">
                        <button type="button" class="btn btn-outline" data-bs-dismiss="modal">Cancel</button>
                        <button type="submit" class="btn btn-primary">
                            <i class="fa fa-send"></i> Save
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

@section('edit-education-details-modal-script')
<script>
    $(document).ready(function() {
            $('#edit_education_details_form').on('submit', function(e) {
                e.preventDefault();

                let formData = new FormData(this);
                let educationId = formData.get('education_id');

                $.ajax({
                    url: `${baseUrl}/student/education-details/${educationId}/update`,
                    method: "POST",
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function(response) {
                        if (response.success) {
                            Swal.fire('Success!', response.message, 'success').then(() => {
                                $('#editEducationDetailsModal').modal('hide');
                                location.reload();
                            });
                        } else {
                            Swal.fire('Error!', response.message || 'Something went wrong.',
                                'error');
                        }
                    },
                    error: function(xhr) {
                        let msg = xhr.responseJSON?.message || 'Something went wrong.';
                        Swal.fire('Error!', msg, 'error');
                    }
                });
            });
        });
</script>
@endsection