@extends('library.admin.layouts.admin_design')

@section('title')
    <title>Issue Book - School Library</title>
@endsection

@section('content')
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->

        <!-- Main content -->
        <section class="content">

            <!-- Basic Forms -->
            <div class="box box-solid box-info">
                <div class="box-header with-border">
                    <h6 class="box-subtitle text-white">Add Issued Book Information</h6>
                </div>
                <!-- /.box-header -->
                <div class="box-body">
                    <div class="row">
                        <div class="col">
                            <form action="{{route('library.issue.store')}}" autocomplete="off" method="post" enctype="multipart/form-data">
                                @csrf

                                 <div class="form-group">
                                <label>Select Role</label>
                                <select class="form-control select2" style="width: 100%;" name="role" id="role" onchange="toggle_student(this.value)">
                                  <option aria-readonly="true" disabled selected>Select Role</option>
                                  <option value="teacher">Teacher</option>
                                  <option value="student">Student</option>
                                </select>
                              </div>

                              <div class="form-group" id="student_div" style="display:none;">
                                    <h5>Student Id<span class="text-danger"></span></h5>
                                    <div class="controls">
                                        <input type="text" name="role_id_student" id="student_id"  placeholder="Select Student" onkeyup="student_search()" class="form-control" data-validation-required-message="Student Id is required" >
                                        <div id="studentList" class="studentListContainer"></div>
                                    </div>
                                </div>

                                <div class="form-group" id="techer_div" style="display:none;" >
                                    <h5>Teacher Id<span class="text-danger"></span></h5>
                                    <div class="controls">
                                        <input type="text" name="role_id_teacher" id="techer_id" placeholder="Select Teacher" onkeyup="teacher_search()" class="form-control" data-validation-required-message="Teacher Id is required" >
                                        <div id="teacherList" class="teacherListContainer"></div>
                                    </div>
                                </div>

                                <div class="form-group" id="returndate_student" style="display:none;">
                                        <h5>Return Date<span class="text-danger">*</span></h5>
                                        <div class="controls">
                                            <input type="date"  readonly name="return_date" id="return_date" class="form-control" data-validation-required-message="Return Date is required" >
                                        </div>
                                    </div>

                                    <div class="form-group">
                                            <h5>Book Id<span class="text-danger">*</span></h5>
                                            <div class="controls">
                                                <input type="text" name="book_isbn" id="book_isbn" onkeyup="fetch_id()" placeholder="Select Book..." class="form-control" data-validation-required-message="Book Id is required" >
                                                <input type="hidden" name="book_id" id="book_id"  placeholder="Select Book..." class="form-control">
                                                <div id="test" class="bookListContainer" hi></div>
                                            </div>
                                        </div>

                                        <div class="row">
                                            <div class=" col-sm-6" id="student_detail" style="display:none;">
                                                <div class="card">
                                                    <div class="card-header d-flex justify-content-between">
                                                        <span><i class="fa fa-user mr-2"></i> Student Information</span>
                                                    </div>
                                                  <img class="card-teacher" id="simage" src="{{asset('adminpanel/uploads/profile/student.png')}}" alt="Card image cap">
                                                  <div class="card-body">
                                                    <h4 class="card-title"><span id="sname"></span></h4>
                                                    <div class="row">
                                                        <div class="col-md-6">
                                                             <label class="card-text">Student Id:</label>&nbsp;<span id="sid"></span>
                                                        </div>
                                                        <div class="col-md-6">
                                                             <label class="card-text">Gender:</label><span id="sgender"></span>
                                                         </div>
                                                         <div class="col-md-12">
                                                            <label class="card-text">Email:</label>&nbsp;<span id="semail"></span>

                                                        </div>
                                                    </div>

                                                  </div>
                                                  <div class="card-footer justify-content-between d-flex">
                                                        <ul class="list-inline mb-0 mr-2">
                                                                <li class="list-inline-item" id="studentDetail" style="padding:0px!important">
                                                                 </li>
                                                        </ul>
                                                  </div>
                                                </div>
                                            </div>

                                            <div class="col-sm-6" id="teacher_detail" style="display:none;">
                                                <div class="card">
                                                    <div class="card-header d-flex justify-content-between">
                                                        <span><i class="fa fa-user mr-2"></i> Teacher Information</span>
                                                    </div>
                                                  <img class="card-teacher" id="timage" src="{{asset('adminpanel/uploads/profile/student.png')}}" alt="Card image cap">
                                                  <div class="card-body">
                                                    <h4 class="card-title"><span id="tname"></span></h4>
                                                    <div class="row">
                                                        <div class="col-md-6">
                                                             <label class="card-text">Teacher Id:</label>&nbsp;<span id="tid"></span>
                                                        </div>
                                                        <div class="col-md-6">
                                                             <label class="card-text">Gender:</label>&nbsp;<span id="tgender"></span>
                                                         </div>
                                                         <div class="col-md-12">
                                                            <label class="card-text">Email:</label>&nbsp;<span id="temail"></span>

                                                        </div>
                                                    </div>

                                                  </div>
                                                  <div class="card-footer justify-content-between d-flex">
                                                        <ul class="list-inline mb-0 mr-2">
                                                                <li class="list-inline-item" id="teacherDetail" style="padding:0px!important">

                                                                </li>
                                                        </ul>
                                                  </div>
                                                </div>
                                            </div>

                                            <div class="col-sm-6" id="book_detail" style="display:none;">
                                                <div class="card">
                                                    <div class="card-header d-flex justify-content-between">
                                                        <span><i class="fa fa-user mr-2"></i> <a href="#">Book Information</a></span>
                                                    </div>
                                                  <img class="card-teacher" id="bimage" src="{{asset('adminpanel/uploads/book/4354.jpg')}}" alt="Card image cap">
                                                  <div class="card-body">
                                                    <h4 class="card-title"><span id="bname"></span><span id="bstatus" class="float-right small"></span></h4>

                                                    <span id ="bdescription"></span>
                                                    <span id = "fine" style="display:none;"></span>
                                                  </div>
                                                  <div class="card-footer justify-content-between d-flex">
                                                    <ul class="list-inline mb-0 mr-2">
                                                            <li class="list-inline-item" id="bookDetail" style="padding:0px!important">
                                                             </li>

                                                    </ul>


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

                                      </div>


                                <div class="text-xs-right float-right" id="issueReturnBtns">


                                </div>
                                <div class="modal center-modal fade" id="fineModal" tabindex="-1">
                                        <div class="modal-dialog">
                                          <div class="modal-content">
                                            <div class="modal-header">
                                              <h5 class="modal-title">Modal Calculation</h5>
                                              <button type="button" class="close" data-dismiss="modal">
                                                 <span aria-hidden="true">&times;</span>
                                              </button>
                                            </div>
                                            <div class="modal-body">
                                            <div class="form-group">
                                                    <h5>Sub Total<span class="text-danger">*</span></h5>
                                                    <div class="controls">
                                                        <input type="text"  readonly name="sub_total" id="sub_total" class="form-control" data-validation-required-message="Return Date is required" >
                                                    </div>
                                             </div>
                                            <div class="form-group" >
                                                    <h5>Discount<span class="text-danger">*</span></h5>
                                                    <div class="controls">
                                                        <input type="text" name="discount" id="discount" onkeyup="calculatediscount(this.value)" min="0" class="form-control" data-validation-required-message="Return Date is required" >
                                                    </div>
                                                </div>
                                            <div class="form-group">
                                                <h5>Grand Total<span class="text-danger">*</span></h5>
                                                <div class="controls">
                                                    <input type="text" name="grand_total" readonly id="grand_total" class="form-control" data-validation-required-message="Return Date is required" >
                                                </div>
                                            </div>


                                            </div>
                                            <div class="modal-footer modal-footer-uniform">
                                              <button type="button" class="btn btn-bold btn-pure btn-secondary float-right" onclick="returnbook()">Return now</button>
                                            </div>
                                          </div>
                                        </div>
                                      </div>
                            </form>

                        </div>
                        <!-- /.col -->
                    </div>

                    <!-- /.row -->

                </div>

                <!-- /.box-body -->

            </div>
            <div class="row">
                    <div class="col-12">



                            <div class="box box-solid box-primary">
                                <div class="box-header with-border">
                                    <h4 class="box-title">List of Book Issued</h4>

                                </div>

                                <!-- /.box-header -->
                                <div class="box-body">
                                    <div class="table-responsive">
                                        <table id="example" class="table table-bordered table-hover display nowrap margin-top-10 w-p100">
                                            <thead>
                                            <tr>
                                                <th>#</th>
                                                <th>Role</th>
                                                <th>User Id</th>
                                                <th>Book Isbn</th>
                                                <th>Issue Date</th>
                                                <th>Date to be Return</th>
                                            </tr>
                                            </thead>
                                            <tbody>

                                            @foreach($issue as $cat)
                                                <tr>
                                                    <td>{{$loop->index + 1}}</td>
                                                    <td>{{$cat->role}}</td>
                                                    <td>@if($cat->role == "teacher")
                                                        {{$cat->role_id_teacher}}
                                                @else
                                                    {{$cat->role_id_student}}

                                                @endif</td>
                                                    <td>{{$cat->book_isbn}}</td>
                                                    <td>{{date('Y-m-d',strtotime($cat->created_at))}}</td>
                                                    <td>{{$cat->return_date}}</td>

                                                </tr>
                                                @endforeach
                                            </tbody>

                                        </table>
                                    </div>
                                </div>
                                <!-- /.box-body -->
                            </div>
                            <!-- /.box -->
                        </div>
                <!-- /.col -->
            </div>
            <!-- /.box -->

        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->
    @endsection

@section('scripts')
    <script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
    <!-- Form validator JavaScript -->
    <script src="{{asset('adminpanel/js/pages/validation.js')}}"></script>



    <script type="text/javascript">
        @if(session('flash_message'))
        swal("Success!", "{!! session('flash_message') !!}", "success")
        @endif
    </script>

<script>
        // $('#test').hide();

        var originalStudentData=null,originalTeacherData=null,singlebookselected=null;

        var userselected=bookselected=false;



       function student_search() {

        $('#studentList').show();
        var input, filter, ul, li, a, i;
        input = document.getElementById("student_id");
        filter = input.value.toUpperCase();
        div = document.getElementById("studentList");
        // alert('studentList');
        a = div.getElementsByTagName("p");
        console.log(a.length);
        for (i = 0; i < a.length; i++) {
            txtValue = a[i].textContent || a[i].innerText;
            if (txtValue.toUpperCase().indexOf(filter) > -1) {
                a[i].style.display = "";
            } else {
                a[i].style.display = "none";
            }
        }
    }
        function teacher_search() {
            // alert('fghj');
            $('#teacherList').show();
            var input, filter, ul, li, a, i;
            input = document.getElementById("techer_id");
            filter = input.value.toUpperCase();
            div = document.getElementById("teacherList");
            // alert('studentList');
            a = div.getElementsByTagName("p");
            console.log(a.length);
            for (i = 0; i < a.length; i++) {
                txtValue = a[i].textContent || a[i].innerText;
                if (txtValue.toUpperCase().indexOf(filter) > -1) {
                    a[i].style.display = "";
                } else {
                    a[i].style.display = "none";
                }
            }
        }




        function toggle_student(sel) {

            console.log(sel);
            var data = document.getElementById('role').value;

            if (data == 'student') {

                $('#techer_div').hide();
                getStudentList();
                $('#student_div').show();
                $('#teacherList').empty();
               $('#return_date').val("{{ \Carbon\Carbon::now()->addDay(15)->toDateString() }}");
               $('#returndate_student').show();
                // $('#studentList').hide();


            }
            else {
                $('#student_div').hide();
                getTeacherList();
                $('#techer_div').show();
                $('#studentList').empty();
                $('#return_date').val("{{ \Carbon\Carbon::now()->addDay(20)->toDateString() }}");
                $('#returndate_student').show();
                // $('#teacherList').hide();
            }


       }
         function getStudentList() {
            $.ajax({
                url: " https://demomanager.a1pathshala.com/manager/a1_api/",
                method: 'POST',
                data: '{"operation":"details","type":"allactivestudentdetails"}',
                dataType: 'json',
                success: function (data) {

                    var dataR = '';
                    if (data.status == '200') {

                        data = data.data;
                        role_student = data;
                        console.log("student_details", data);
                        originalStudentData=data;
                        // return;
                        var i=0;
                        data.forEach(function (element) {

                            // dataR +="<option value='"+element.role_code+"' >"+element.role+"</option>";
                            // dataR += "<option value='" + element.id + "' >" + element.name + "</option>";
                            dataR += "<p class='studentList' onclick='selectedItem("+(i++)+",`student`)'>"+element.admission + " / " + element.class_name+"-"+element.section_name + " / " + element.name +"</p>";

                        })
                        // debugger;
                        $('#studentList').append(dataR);
                    }
                },
                error: function (err) {
                    console.log("error:", err);
                }
            })
        }
        function getTeacherList() {
            $.ajax({
                url: "https://demomanager.a1pathshala.com/manager/a1_api/",
                method: 'POST',
                data: '{"operation":"details","type":"allactivestaffdetails"}',
                dataType: 'json',

                success: function (data) {
                    var dataR = '';
                    if (data.status == '200') {
                        data = data.data;
                        role_teacher = data;
                        console.log("teacher_details", data);
                        data=data.filter(function (obj) {

                            return obj.type=="teacher";
                            // console.log("teacher_details", data);
                        });
                        originalTeacherData=data;
                        // debugger;
                        var i=0;
                        data.forEach(function (element) {
                            // dataR +="<option value='"+element.role_code+"' >"+element.role+"</option>";
                            dataR += "<p class='studentList' onclick='selectedItem("+(i++)+",`teacher`)'>"+element.id+" "+element.name+"</p>";

                        })

                        $('#teacherList').append(dataR);
                    }
                },
                error: function (err) {
                    console.log("error:", err);
                }
            })
        }

        function selectedItem(id,type) {

            if(type=='student'){
                userselected = true;
                console.log('selected student:',originalStudentData[id]);
                $('#student_id').val(originalStudentData[id].id);
                selectedItemView(id,type);
                $('#studentList').hide();
                // selectedItemView(id,type);

            }
            else  if(type=='book'){
                bookselected = true;
                $('#fine').hide();
                console.log('selected book:',originalBookData[id]);
                $('#book_isbn').val(originalBookData[id].isbn);
                $('#book_id').val(originalBookData[id].book_id);
                // $('#book_status').val(originalBookData[id].status);
                if(originalBookData[id].status == "issued"){
                 finecalculate(originalBookData[id].isbn)

                }
                selectedItemView(id,type);
                // $('#bisbn').text(originalBookData[id].isbn);
                // $('#bid').text(originalBookData[id].id);
            }
            else  if(type=='teacher'){
                userselected = true;
                console.log('selected teacher:',originalTeacherData[id]);

                $('#techer_id').val(originalTeacherData[id].id);
                selectedItemView(id,type);
                $('#teacherList').hide();
                // selectedItemView(id,type);
            }
            else {
                console.log("something went wrong");
                alert("error");
            }


        }


        function fetch_id()
        {

            $('#test').empty();

           var isbn= $('#book_isbn').val();

            $.ajax({
                url:"{{ route('library.live_search.action') }}",
                method:'POST',
                data:{'query':isbn,'_token': '{{csrf_token()}}' },
                dataType:'json',
                success:function(data)
                {

                    var dataR='';
                    originalBookData=data;
                    // console.log('all books:',originalBookData);
                    var i=0;
                    data.forEach(function(element) {
                        // console.log('id: '+element.book_id+'  isbn: '+element.isbn+'  title: '+element.title+' detail: '+element.detail+'');

                        dataR +="<p class='bookList' onclick='selectedItem("+ (i++) +",`book`)'>"+element.isbn+" "+element.title+"</p>";
                    });

                    $('#test').append(dataR);
                    $('#test').show();
                },
                error:function (err) {

                    console.log("error:",err);
                    $('#test').hide();
                }

            })
        }

        $('html').click(function (e) {
            // alert("sakdhas");
            if (e.target.id == 'studentList' || e.target.id == 'teacherList' || e.target.id =='test') {

            } else {
                $('#studentList').hide();
                $('#teacherList').hide();
                $('#test').hide();
            }
        });




        function selectedItemView(id,type) {
            if(type=='book') {
                singlebookselected = originalBookData[id];
                console.log('selected book:', originalBookData[id]);
                $('#bname').text(originalBookData[id].title);
                $('#bisbn').text(originalBookData[id].isbn);
                $('#book_title').val(originalBookData[id].title);
                // $('#book_title').val(originalBookData[id].book_id);

                $('#bid').text(originalBookData[id].id);
                $('#bdescription').html(originalBookData[id].description);

                    var url = '{{ route("library.book_details", ":id") }}';

                    url = url.replace(':id', originalBookData[id].isbn);

                    var xyz="<a href="+url+" class='btn btn-success btn-xs'> Show Detail</a>";
                    $('#bookDetail').html(xyz);

                // debugger;
                var class1='text-danger';
                if(originalBookData[id].status == 'available'){
                    class1='text-success';
                }
                $('#bstatus').html("Status: <span class="+class1+">"+originalBookData[id].status)+'</span>';

                if(originalBookData[id].image && originalBookData[id].image != ""){
                $('#bimage').attr('src',originalBookData[id].image);
                }
                $("#book_detail").show();

                toggle_issueReturnBtn(originalBookData[id].status,originalBookData[id].isbn);




            }
            else if(type=='student') {
                console.log('selected student:', originalStudentData[id]);
                // debugger;
                $('#sname').text(originalStudentData[id].name);
                // $('#bisbn').text(originalStudentData[id].isbn);
                $('#sid').text(originalStudentData[id].id);
                var url = '{{ route("library.student_details", ":id") }}';

                url = url.replace(':id', originalStudentData[id].id);

                var b="<a href="+url+" class='btn btn-success btn-xs'> Show Detail</a>";
                $('#studentDetail').html(b);
                if(originalStudentData[id].image && originalStudentData[id].image != ""){
                $('#simage').attr('src',originalStudentData[id].image);
                }
                $('#semail').text(originalStudentData[id].email);
                $('#sgender').text(originalStudentData[id].gender);
                $("#student_detail").show();
                $("#teacher_detail").hide();


            }
            else if(type=='teacher') {
                console.log('selected teacher:', originalTeacherData[id]);
                $('#tname').text(originalTeacherData[id].name);
                $('#tid').text(originalTeacherData[id].id);
                var teacher_url = '{{ route("library.teacher_details", ":id") }}';

                teacher_url = teacher_url.replace(':id', originalTeacherData[id].id);

                var y="<a href="+teacher_url+" class='btn btn-success btn-xs'> Show Detail</a>";
                $('#teacherDetail').html(y);
                if(originalTeacherData[id].image && originalTeacherData[id].image != ""){
                $('#timage').attr('src',originalTeacherData[id].image);
                }
                $('#temail').text(originalTeacherData[id].email);
                $('#tgender').text(originalTeacherData[id].gender);
                $("#teacher_detail").show();
                $("#student_detail").hide();


            }
            else{
                console.log("error in viewing selected information");
                alert("error in viewing seleced data");
            }
        }

        function toggle_issueReturnBtn(bookstatus,isbn){
            $('#issueReturnBtns').empty();
            var t = '<div class="inline">';

            var url = '{{ route("library.issuesetting", ":id") }}';
                    url = url.replace(':id', isbn);

            $.ajax({
                url: url,
                method: 'GET',


                success: function (data) {
                    var data = JSON.parse(data);
                    if (data && data != '') {
                        // debugger;

                        console.log("Issue_Setting_Data", data);
                        if(bookstatus == "available"){
                            t+= '<button type="submit" class="btn btn-cyan showButton show">Issuee</button>';
                        }else if(bookstatus == "issued" && data.issueditem.count== data.settingitem.max_renew_allow){
                            var return_url = '{{ route("library.issuebook.fine", ":id") }}';
                                return_url = return_url.replace(':id', data.issueditem.id);
                                t+= "<button type='button' onclick=openmodal('#modal-open',event,"+data.issueditem.fine+",'"+data.issueditem.book_isbn+"') class='btn btn-success'> Return Book</button>"

                        }
                            else if(bookstatus == "issued"){

                            t+= "<button type='button' onclick=openmodal('#modal-open',event,"+data.issueditem.fine+",'"+data.issueditem.book_isbn+"') class='btn btn-success'> Return Book</button>"
                                var renew_url = '{{ route("library.renew.count", ":id") }}';
                                renew_url = renew_url.replace(':id', data.issueditem.id);
                            t+= "<a href="+renew_url+" class='btn btn-brown'> Renew Book</a>"

                        }else{
                            t+= '<p class="text-danger">Sorry, This Book is '+bookstatus+'.</p>';

                        }
                        t+='</div>';
                        $('#issueReturnBtns').append(t);
                    }
                },
                error: function (err) {
                    console.log("error:", err);
                    t+= '<p>Something went wrong!!</p>';
                    t+='</div>';
                    $('#issueReturnBtns').append(t);
                }
            });

        }

        function openmodal(id,event,fine,isbn){

            // debugger;
            event.preventDefault();
            event.stopPropagation();
            if(parseFloat(fine) > 0){
            $('#fineModal').modal('show');
            }else{
                returnbook();
            }


        }


        function finecalculate(isbn){

            var t = '<div class="inline">';

        var url = '{{ route("library.issuebookfinebyisbn", ":id") }}';
                url = url.replace(':id', isbn);



            $.ajax({
                url: url,
                method: 'GET',


                success: function (data) {

                    var data = JSON.parse(data);
                    // debugger;
                    userdetail(data['data'].role,data['data'].id);
                    if(data['fine'] != null){
                    $('#fine').show();
                    $('#fine').text("Fine: "+data['fine']);
                    $('#sub_total').val(data['fine']);


                    }
                },
                error: function (err) {
                    console.log("error:", err);
                    t+= '<p>Something went wrong!!</p>';
                    t+='</div>';
                    $('#issueReturnBtns').append(t);
                }
            });

        }

        function returnbook(){
            var isbn=singlebookselected.isbn;
            var return_url = '{{ route("library.returnBook", ":id") }}';
                return_url = return_url.replace(':id', isbn);
                // debugger;
                var grand = document.getElementById('grand_total').value.trim()?document.getElementById('grand_total').value:0;
                return_url += "?grandtotal="+grand;
            if($('#fineModal').is(':visible')){
                $('#fineModal').modal('hide')
            }
            window.location.href = return_url;
        }

        function calculatediscount(val){

            var subtotal = document.getElementById('sub_total').value;
            document.getElementById('grand_total').value = subtotal - val;

        }

        function userdetail(role,id){

        var a = role;

        $.ajax({
            method: 'post',
            processData: false,
            contentType: false,
            cache: false,
            // data: JSformDataON.stringify(),
                data: JSON.stringify({"operation":"userDetails","role":role,"data":{"id":id}}),

            enctype: 'multipart/form-data',
                url: 'https://demomanager.a1pathshala.com/manager/a1_api/',
                // method: 'POST',
                // dataType: 'json',
                // data:data,

                success: function (response) {

                    debugger;
                    var obj = JSON.parse(response);
                    // var tm = response.data;
                    // console.log("Datas:",tm);

                    if(obj.status == 200){
                        if(a == 'student'){

                            originalStudentData = obj;
                        }else if(a == 'teacher'){

                            originalTeacherData = obj;
                        }
                    debugger;
                    issuedItemView(obj,a);
                    }else{

                        alert('error');
                    }

                },
                error: function (err) {
                    debugger;
                }
            });

        }

        function issuedItemView(data,a){
            debugger;
            data=data.data;
            if(a=='student') {
                // console.log('selected student:', originalStudentData[id]);
                // debugger;
                $('#sname').text(data.name);
                // $('#bisbn').text(data[id].isbn);
                $('#sid').text(data.id);
                var url = '{{ route("library.student_details", ":id") }}';

                url = url.replace(':id', data.id);

                var b="<a href="+url+" class='btn btn-success btn-xs'> Show Detail</a>";
                $('#studentDetail').html(b);
                if(data.image && data.image != ""){
                $('#simage').attr('src',data.image);
                }
                $('#semail').text(data.email);
                $('#sgender').text(data.gender);
                $("#student_detail").show();
                $("#teacher_detail").hide();


            }
            else if(a=='teacher') {
                console.log('selected teacher:', data);
                $('#tname').text(data.name);
                $('#tid').text(data.id);
                var teacher_url = '{{ route("library.teacher_details", ":id") }}';

                teacher_url = teacher_url.replace(':id', data.id);

                var y="<a href="+teacher_url+" class='btn btn-success btn-xs'> Show Detail</a>";
                $('#teacherDetail').html(y);
                if(data.image && data.image != ""){
                $('#timage').attr('src',data.image);
                }
                $('#temail').text(data.email);
                $('#tgender').text(data.gender);
                $("#teacher_detail").show();
                $("#student_detail").hide();


            }
            else{
                console.log("error in viewing selected information");
                alert("error in viewing seleced data");
            }
        }

    </script>

@endsection