@extends('layouts.admin')
@section('content')
<!--App-Content-->
<div class="app-content my-3 my-md-5">
    <div class="side-app">
        <x-page.header>Registration</x-page.header>
        @include('admin.errors.form-errors')
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-body">
                        <form action="{{ route('staff.examination.register.create') }}" method="GET" aria-labelledby="createSession">
                            <fieldset>
                                <legend id="createSession" class="sr-only">Register student for examination</legend>
                                <div class="form-group">
                                    <label for="student" class=" mt-3 mb-sm-1"> Student: <i
                                            class="text-danger">(required)</i></label>
                                    <select class="form-control select2-show-search" id="student" required name="student">
                                        <option value="0" disabled selected>Search with userID or email</option>
                                    </select>
                                </div>
                                <div class="form-group">
                                    <label for="board" class=" mt-3 mb-sm-1"> Board: <i
                                            class="text-danger">(required)</i></label>
                                    <select class="form-control select2-show-search" id="board" required name="board">

                                    </select>
                                </div>
                                <button type="submit" class="btn btn-primary">Select Courses</button>
                            </fieldset>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('admin-js')
<script>
     $('#student').on('change', function() {
            var $board = $('#board');
            var url="{{ route('getStudentBoards',[':student_id']) }}"
            url=url.replace(':student_id',$(this).val())

            $('#board').empty();
            $('#board').append(`<option value="0" disabled selected>Processing...</option>`);
            $.ajax({
                url: url,
                type: 'GET',
                success: function(data) {
                    $('#board').empty();
                    $('#board').append(
                        `<option value="0" disabled selected>Select Board*</option>`);
                    $.each(data.boards, function(id, value) {
                        $board.append('<option value="' + value.bid + '">' +
                            value.bname + '</option>');
                    });
                }
            });
        });
</script>
@endsection