Untitled

@extends('staff.body.staff_webtemplate')
@section('title','Carian Senarai Pelajar')

@section('custom-asset')
<!-- BEGIN PAGE LEVEL STYLES -->
<link rel="stylesheet" type="text/css" href="{{ asset('gui/plugins/table/datatable/datatables.css')}}">
<link rel="stylesheet" type="text/css" href="{{ asset('gui/plugins/table/datatable/dt-global_style.css')}}">

<!-- END PAGE LEVEL STYLES -->
@endsection 

@section('staff-contents')

<style type="text/css">
    .TFtable tr td {padding: 1px !important; }
    .table-borderless {border:none !important}
    .divLebel {width: 150px};
</style>



<div class="col-xl-12 col-lg-12 col-md-12 col-12 layout-spacing ">
    <div class="widget widget-content-area br-4">
        <div class="widget-one ml-4" style="min-height:40em; width:50%">

       
    <form method="post" action="">
            

                    


            <div class="input-group mb-1 col-sm-10 mt-4">
              <div class="input-group-prepend ">
                <span  class="input-group-text divLebel " >Peringkat</span>
              </div>
              <select class="form-control form-control-sm">
                  <option></option>
                  <option>One</option>
                  <option>Two</option>
                  <option>Three</option>
              </select>
            </div>

            <div class="input-group mb-1 col-sm-10">
              <div class="input-group-prepend ">
                <span  class="input-group-text divLebel " >Program</span>
              </div>
              <select class="form-control form-control-sm">
                  <option></option>
                  <option>One</option>
                  <option>Two</option>
                  <option>Three</option>
              </select>
            </div>

            <div class="input-group mb-1 col-sm-10">
              <div class="input-group-prepend ">
                <span  class="input-group-text divLebel " >Intake</span>
              </div>
              <select class="form-control form-control-sm">
                  <option></option>
                  <option>One</option>
                  <option>Two</option>
                  <option>Three</option>
              </select>
            </div>

            <div class="input-group mb-1 col-sm-10">
              <div class="input-group-prepend ">
                <span  class="input-group-text divLebel" >Status Pengajian</span>
              </div>
              <select class="form-control form-control-sm">
                  <option></option>
                  <option>One</option>
                  <option>Two</option>
                  <option>Three</option>
              </select>
            </div>

            <button class="btn btn-primary mt-4 ml-4">Cari Pelajar</button>

           
       
            
            </form>

        </div>


    </div>
</div>



@endsection

@section('custom-script')
<!-- BEGIN PAGE LEVEL SCRIPTS -->
<script src="{{ asset('gui/plugins/table/datatable/datatables.js')}}"></script>
<script>
 
    $('#zero-config').DataTable({
        "dom": "<'dt--top-section'<'row'<'col-12 col-sm-6 d-flex justify-content-sm-start justify-content-center'l><'col-12 col-sm-6 d-flex justify-content-sm-end justify-content-center mt-sm-0 mt-3'f>>>" +
    "<'table-responsive'tr>" +
    "<'dt--bottom-section d-sm-flex justify-content-sm-between text-center'<'dt--pages-count  mb-sm-0 mb-3'i><'dt--pagination'p>>",
        "oLanguage": {
            "oPaginate": { "sPrevious": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-left"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>', "sNext": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-right"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>' },
            "sInfo": "Showing page _PAGE_ of _PAGES_",
            "sSearch": '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>',
            "sSearchPlaceholder": "Search...",
           "sLengthMenu": "Results :  _MENU_",
        },
        "stripeClasses": [],
        "lengthMenu": [7, 10, 20, 50],
        "pageLength": 7 
    });

</script>
@endsection