@extends('website.layouts.master')
@section('title', __('tr.Academic Staff'))

@section('content')

@include('website.layouts.title', ['simple'=>true])

<section>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <br/>
                <br/>
                <input type="text" required class="form-control" id="search" name="search" style="height: 40px; padding: 15px; color: #007bff;" placeholder="@lang('tr.Search')">                
                <hr>
                <div id="tag_container">
                    @include('website.staff.presult')
                </div>
                <hr>
                <input type="hidden" name="hidden_page" id="hidden_page" value="1"/>               
            </div>
        </div>
    </div>
</section>

@endsection

@section('pagejs')
<script>
$(document).ready(function(){

    function search(page, query) {
        var link = "{{route('staff_search')}}?page="+page+"&query="+query;
        $.ajax({
            url:link,
            success:function(data) {
                $('#tag_container').html('');
                $('#tag_container').html(data);
            }
        });
    }

    $(document).keypress( function(e){
        var key = e.which;
        if(key == 13){
            query = $('#search').val();
            page = $('#hidden_page').val();
            search(1,  query);
        }
    });

    $('#search').on('keyup',function(){
        //if(!$(this).val()){
            var query = $('#search').val();
            search(1,  query);
        //}
    })

    $(document).on('click', '.pagination', function(event){
        event.preventDefault();
        var page = $(this).attr('page');
        $('#hidden_page').val(page);
        var query = $('#search').val();
        search(page, query);
    });
});
</script>
@endsection