@extends('layouts.admin')

@section('content')
    <main role="main" class="flex-shrink-0">
        <div class="container custom-container">
            <style>
                .btn-header-link::after {
                    display: none !important;
                }

                .modal-dialog {
                    max-width: 90%;
                }
            </style>
            <div class="login-5 mt-50 mb-50">
                <div class="container-fluid">
                    <div class="row no-gutters">
                        @include('layouts.partials.left_navbar')
                        <div class="col-sm-8">
                            <div class="container">
                                <div class="card">
                                    <div class="card-header">
                                        <h4 class="mb-0 p-2 fw-bold fs-3">Exams/Events </h4>
                                    </div>
                                    <div class="card-body">
                                        <div class="container">
                                            <div class="row justify-content-center" id="searchResults">
                                                <form id="exam_form" method="POST" action="{{ route('exam-dashboard') }}">
                                                    @csrf
                                                    <div class="col-md-6 col-xs-6 mx-auto">
                                                        <select class="form-select form-select-lg p-3 cursor-pointer fs-3"
                                                            id="ExamSelect" name="ExamType">
                                                            <option selected="" disabled="">Please Select Exam
                                                            </option>
                                                                                                                    </select>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </main>
@endsection
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#Search").keyup(function() {
            var serachvalue = $("#Search").val();
            $.ajax({
                url: "{{ route('serachExam') }}",
                method: 'POST',
                data: {
                    serachvalue: serachvalue,
                    _token: '{{ csrf_token() }}'
                },
                success: function(response) {
                    var resultsList = $('#searchResults');
                    $('.allResults').hide();
                    resultsList.empty();
                    $.each(response, function(index, exam) {
                        var html =
                            '<div class="col-md-4 col-xs-6 cursor-pointer submitForm" lang="1">';
                        html +=
                            '<a href="/Centralized_ERP_Billing/public/examdashboard/' +
                            exam.examtype + '">';
                        html += '<div class="single-item custom-item-1 c' + (index +
                            1) + '">';
                        html += '<div class="bg-layer"></div>';
                        html += '<div class="content_box custom-content-box">';
                        html +=
                            '<div class="icon-box"><img class="img-responsive icon-img" src="https://billing.ntaonline.in:4433/backend/web/uploads/plus.png"></div>';
                        html += '</div>';
                        html += '<h5 class="custom-h5">' + exam.examname + '</h5>';
                        html += '</div>';
                        html += '</a>';
                        html += '</div>';
                        resultsList.append(html);
                    });
                },
                error: function(data) {
                    $('.allResults').show();
                }

            });
        });
    });
</script>
<script>
    //    $(document).ready(function() {
    //     $("#ExamSelect").change(function() {
    //         var ExamSelect = $(this).val();
    //         var url = "{{ route('exam-dashboard', ':ExamSelect') }}";
    //         url = url.replace(':ExamSelect', ExamSelect);
    //         window.location.href = url;
    //     });
    // });
    $(document).ready(function() {
        $('#ExamSelect').on('change', function() {
            if (this.value) {
                $('.overlay').show();
                $('#exam_form').submit();
            }
        })
    })
</script>