<div class="date-filter12">
<div class="row">
<div class="col-md-12">
<h4 class="text text-primary">Search By Date:</h4>
</div>
<div class="col-md-2">
<label>From Date:</label>
<input type="text" id="min" name="min" class="form-control">
</div>
<div class="col-md-2">
<label>To Date:</label>
<input type="text" id="max" name="max" class="form-control">
</div>
</div>
</div>
Data Table start here : id is very important check id okay
<table id="example" class="display" style="width:100%">
<thead class="table-light">
<tr>
<th>Referenc#</th>
<th>Pick Date</th>
<th>Origin</th>
<th>Drop</th>
<th>Truck</th>
<th>Load Type</th>
<th>Broker</th>
<th>Status</th>
<th>Date</th>
<th>Action</th>
</tr>
</thead>
<tbody id="lodetypeerStatus">
@php $i=1;
@endphp
@foreach($userdata as $loads_data)
<?php
// $shipment_res = App\Models\Load::where('user_id',$loads_data['user_id'])->orderBy('id','desc')->get();
// dd($shipment_res);
$shipment_res = App\Models\Load::where([['user_id',$loads_data['user_id']],['load_status', '=', '0'] ])->orderBy('id','desc')->get();
?>
@foreach($shipment_res as $user_load)
<tr class="odd">
<td class="copy-text">{{ $user_load->ref_no }}</td>
<td class="copy-text">{{ $user_load->post_date }}</td>
<td class="copy-text">{{ $user_load->load_state_origin }}</td>
<td class="copy-text">{{ $user_load->load_city_desti }}</td>
<td class="copy-text">{{ $user_load->equipments }}</td>
<td class="copy-text">{{ $user_load->full_partial_tl_ltl }}</td>
@php
$user = App\Models\User::where('id',$user_load['user_id'])->first();
$name= isset($user['name']) ? $user['name'] : null;
@endphp
<td>{{ucfirst($name)}}</td>
<?php
$status= $user_load->load_status;
$date_pick= explode("T",$user_load->dat_pick_date);
$date_pick1= strtotime($date_pick['0']);
$today= strtotime(date('Y-m-d'));
$lstatus= '';
if($today > $date_pick1){
$lstatus = 'Expire';
}else{
if($status == 1){
$lstatus = 'Delete';
}else{
$lstatus = 'Active';
}
}
?>
<td>{{ $lstatus }}</td>
<!--<td>{{ date('d M, Y', strtotime($user_load->created_at) )}}</td>-->
{{-- <td>{{ date('Y-m-d', strtotime($user_load->created_at) )}}</td> --}}
<td>{{ date('m/d/Y', strtotime($user_load->created_at) )}}</td>
<td style="width: 80px;" class="action_tooltip classToInclude" >
<input type="hidden" value="{{ $user_load->load_dat_id }}" id="load_dat_id">
<button type="button" class="btn btn-outline-secondary btn-sm radius-30 px-4" id="load_update_form_btn"><i class="bx bx-edit"></i><span class="tooltip">Edit</span></button>
<button type="button" class="btn btn-outline-danger btn-sm radius-30 px-4" id="load_delete_btn" ><i class="bx bx-trash"></i><span class="tooltip">Delete</span></button>
</td>
</tr>
@endforeach
@endforeach
</tbody>
<tfoot>
<tr>
<th>Referenc#</th>
<th>Pick Date</th>
<th>Origin</th>
<th>Drop</th>
<th>Truck</th>
<th>Load Type</th>
<th>Broker</th>
<th>Status</th>
<th>Date</th>
<th>Action</th>
</tr>
</tfoot>
</table>
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.3/css/jquery.dataTables.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/datetime/1.3.1/css/dataTables.dateTime.min.css">
<script>
Note: *** 8 is number of date column 0 to 8 means 9 number column.
var startDate = new Date(data[8]);
endnote
$(document).ready(function () {
$.fn.dataTable.ext.search.push(
function (settings, data, dataIndex) {
var min = $('#min').datepicker('getDate');
var max = $('#max').datepicker('getDate');
var startDate = new Date(data[8]);
if (min == null && max == null) return true;
if (min == null && startDate <= max) return true;
if (max == null && startDate >= min) return true;
if (startDate <= max && startDate >= min) return true;
return false;
}
);
$('#min').datepicker();
$('#max').datepicker();
var table = $('#example').DataTable();
// Event listener to the two range filtering inputs to redraw on input
$('#min, #max').change(function () {
table.draw();
});
});
</script>
