[SETTING] Auto Filter

@extends('admin.layoutview')
@section('content')

<div class="col-md-6" style="padding:0;">
    <h1>{{$title}}</h1>
</div>
<div class="col-md-6" style="padding:16px 0 0;">
    <div class="table-toolbar">
        <div class="btn-group pull-right">
            <button class="btn btn-default" onclick="window.location.href='{{ url("cuti/add") }}'">
                <i class="fa fa-plus"></i> &nbsp;&nbsp;<b>Add New</b>
            </button>
            <button class="btn btn-default" data-toggle="dropdown"><b>Tools</b> &nbsp;<i class="fa fa-caret-down"></i></button>
            <ul class="dropdown-menu pull-right">
                <li>
                    <a href="#"><i class="fa fa-print"></i>&nbsp;&nbsp;Print</a>
                </li>
                <li>
                    <a href="#"><i class="fa fa-file-pdf-o"></i>&nbsp;&nbsp;Save as PDF</a>
                </li>
                <li>
                    <a href="#"><i class="fa fa-file-excel-o"></i>&nbsp;&nbsp;Export to Excel</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="clearfix"></div>
<br/>
<select id="myInput" onchange="myFunction()">
   <option value="">- Status -</option>
   <option value="1">Pending</option>
   <option value="2">Approve</option>
   <option value="3">Cancel</option>
   <option value="4">Reject</option>
</select>
<div class="portlet box grey">
    <div class="portlet-body">
        <table id="myTable" cellpadding="0" cellspacing="0" border="0"  class="table table-striped table-hover">
            <form id="frmdata">
                <tr>
                    <th>No</th>
                    <th>Nama Karyawan</th>
                    <th>Alamat</th>
                    <th>Bagian</th>
                    <th>Jumlah Hari</th>
                    <th>Dari Tanggal</th>
                    <th>Sampai Tanggal</th>
                    <th>Jenis Cuti</th>
                    <th>Action Status</th>
                    <th>Status</th>
                    <th>Action</th>
                </tr>
                <?php $no = 1?>
                @foreach($data as $row)

                <tr class="gradeX">
                    <td style="line-height:6.2;">{!! $no++ !!}</td>
                    <td style="line-height:6.2;">{!! $row["admin_name"] !!}</td>
                    <td style="line-height:6.2;">{!! $row["alamat"] !!}</td>
                    <td style="line-height:6.2;">{!! $row["user_group_name"] !!}</td>
                    <td style="line-height:6.2;">{!! $row["jumlah_hari"] !!}</td>
                    <td style="line-height:6.2;">{!! $row["dari"] !!}</td>
                    <td style="line-height:6.2;">{!! $row["sampai"] !!}</td>
                    <td style="line-height:6.2;">{!! $row["jenis"] !!}</td>
                        <td style="line-height:6.2;">
                        <form action="{{url('cuti/approved/'.$data[0]['id_cuti'])}}" method="POST">
                        <button class="btn btn-action" type="submit"><i class="kfa fa fa-approve">Approve</i></button>
                    </form>
                        <form action="{{url('cuti/cancel/'.$data[0]['id_cuti'])}}" method="POST">
                        <button class="btn btn-action" type="submit"><i class="kfa fa fa-approve">Cancel</i></button>
                        </form>
                        <form action="{{url('cuti/reject/'.$data[0]['id_cuti'])}}" method="POST">
                        <button class="btn btn-action" type="submit"><i class="kfa fa fa-approve">Reject</i></button>
                    </form>
                    </td>
                    <td style="line-height:6.2;">{!! $row["status"] !!}</td>
                    <td style="line-height:6.2;">
                        <button class="btn btn-action" onclick="window.location.href='{!! url("cuti/edit/".$row["id_cuti"]) !!}'"><i class="kfa fa fa-file"></i></button>
                        <button class="btn btn-action" onclick="del_confirm('Are you sure to delete {!! $row["id_cuti"] !!} from users?','{{ url("cuti/delete/".$row["id_cuti"]) }}')"><i class="kfa fa fa-remove"></i></button>
                        </form>
                    </td>
                </tr>

                @endforeach

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

<script>
    function del_confirm(msg,url){
        if(confirm(msg)){
            window.location.href=url
        }else{
            false;
        }
    }
</script>
<script>
function myFunction() {
  var input, filter, table, tr, td, i, txtValue;
  input = document.getElementById("myInput");
  filter = input.value.toUpperCase();
  table = document.getElementById("myTable");
  tr = table.getElementsByTagName("tr");
  for (i = 0; i < tr.length; i++) {
    td = tr[i].getElementsByTagName("td")[9];
    if (td) {
      txtValue = td.textContent || td.innerText;
      if (txtValue.toUpperCase().indexOf(filter) > -1) {
        tr[i].style.display = "";
      } else {
        tr[i].style.display = "none";
      }
    }
  }
}
</script>

@endsection