@extends('admin.include.main')
@section('content')
    <style>
        select { -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; } select:hover { background-color:gren; } option:hover { background-color:green;color:white; } option { -webkit-border-radius:25px; -moz-border-radius:25px; border-radius:25px; color:blue; background-color:white; }
    </style>
    <div class="wrapper wrapper-content">

        <div class="row">
            <div class="col-lg-12">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5>All form elements <small>With custom checbox and radion elements.</small></h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#" class="dropdown-item">Config option 1</a>
                                </li>
                                <li><a href="#" class="dropdown-item">Config option 2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">
                        <form action="{{route('printgatepass')}}" method="POST">
                            @csrf

                        <div class="hr-line-dashed"></div>



                        <h1>For Multiple Students</h1>
                            <div class="row">
                                    <div class="col-md-4">
                                        <div class="form-group"><label>Select Class<span class="text-danger">*</span></label>
                                            <select class="form-control m-b" name="class" id="class_select" onchange="showsections()">
                                                <label>Select Class<span class="text-danger">*</span></label>

                                                <option value="" selected disabled>Select Class</option>
                                               @foreach($class as $classes)
                                                <option value="{{$classes->id}}">{{$classes->class_name}}</option>
                                                @endforeach

                                            </select>

                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="form-group"><label>Select Section<span class="text-danger">*</span></label>
                                            <select class="form-control m-b" name="section" id="sectionselect"  onchange="studentlists()">
                                                <label>Select Section<span class="text-danger">*</span></label>

                                                <option value="" selected disabled>Select Section</option>




                                            </select>

                                        </div>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="form-group"><label>Select Student<span class="text-danger">*</span></label>
                                            <select class="form-control m-b" name="student" id="studentlist">
                                                <label>Select Student<span class="text-danger">*</span></label>

                                                <option value="" selected disabled>Select Student</option>



                                            </select>

                                        </div>
                                    </div>
                                </div>
                        {{-- <button type="submit" class="btn btn-success">Submit</button> --}}
                        <input type="submit" name="submit" value="multi_submit" class="btn btn-success">
                        <div class="hr-line-dashed"></div>


                        <div class="active-student" style="padding-top:10px;">
                        <h2>For Active Students</h2>
                        <div class="row">
                            <div class="col-md-12">
                                <div class="form-group"><label>All Active Student<span class="text-danger">*</span></label>
                                    <select class="form-control m-b" name="all_class">
                                        <label>Active Student<span class="text-danger">*</span></label>

                                        <option value="" selected disabled>Select Class</option>

                                         @foreach($class as $classes)
                                                <option value="{{$classes->id}}">{{$classes->class_name}}</option>
                                                @endforeach


                                    </select>

                                </div>
                            </div>

                        </div>
                        {{-- <button type="submit" class="btn btn-success">Submit</button> --}}
                            <input type="submit" name="submit_all" value="all_submit" class="btn btn-success">

                    </div>
                        <div class="hr-line-dashed"></div>




                        <h3>For Particular Student</h3>
                        <div class="row">

                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Search Student</label>
                                    <input type="text" name="search" id="search_student" class="form-control"  onkeyup="searchstudent()">
                                    <input type="text" name="student_id" id="student_id" hidden>
                                    <div id="searchlist" style=""></div>
                                </div>
                            </div>
                        </div>
                        {{-- <button type="submit" class="btn btn-success">Submit</button> --}}
                         <input type="submit" name="submit_part" value="part_submit" class="btn btn-success">

                        </form>
                    </div>
                </div>












</div>
</div>
</div>

<script>
    function showsections(){
         var class_id=$('#class_select').val();

        var url="{{url('')}}";
        $.get(url+'/class_section?class_id=' +class_id,function (data) {
            $('#sectionselect').empty();
            debugger;
           $('#sectionselect').append('<option> select section</option>');
            $.each(data,function (index,subcatObj) {
                $('#sectionselect').append('<option value="'+subcatObj.id+'"> '+subcatObj.section_name+'</option>');
            })
        })
    }

     function studentlists(){
        debugger;
         var class_id=$('#class_select').children("option:selected").val();
        var section_id=$('#sectionselect').children("option:selected").val();
         var url="{{url('')}}";
         // debugger;
        $.get(url+'/getstudents?class_id=' +class_id+'&section_id='+section_id,function (data) {
            $('#studentlist').empty();
            debugger;
            $.each(data,function (index,subcatObj) {
                $('#studentlist').append('<option value="'+subcatObj.id+'"> '+subcatObj.name+'</option>');
            })
        })
    }

    function searchstudent(){
        // debugger;
        var data=$('#search_student').val();
                 var url="{{url('')}}";
         // debugger;
        $.get(url+'/searchstudent?name=' +data,function (data) {
            $('#searchlist').empty();
            // debugger;
            $.each(data,function (index,subcatObj) {
                $('#searchlist').append('<option value="'+subcatObj.id+'" id="'+subcatObj.name+'" onclick="setstudentvalue(this)" class="searchoption" onMouseOver="alert("a")" onmouseout="resetcolor(this)" > '+subcatObj.name+'(class:'+subcatObj.class_name+' section:'+subcatObj.section_name+')'+'</option>');
            })
            // debugger;
        })


    }
    function setstudentvalue(val){
        var name=val.id;
        var id=val.value;
        $('#search_student').val(name);
        $('#student_id').val(id);
        $('#searchlist').empty();
    }
    function changecolor(v){

    }

</script>

@endsection