Aside from doing indexes, and use join() instead of with(). This example uses the DataTables library. <link rel= "stylesheet" href= "https://cdn.datatables.net/2.3.7/css/dataTables.dataTables.css" /> <script src= "https://cdn.datatables.net/2.3.7/js/dataTables.js" ></script> Enter fullscreen mode Exit fullscreen mode 1. Route Route :: post ( '/data' , [ App\Http\Controllers\MyController :: class , 'datatable' ]) -> name ( 'mydata.datatable' ); Enter fullscreen mode Exit fullscreen mode 2. View Date input, datatable, and button. <div class= "mb-4 form-group col-lg-4" > <label class= "form-label" > Start Date </label> <input type= "text" name= "start_date" id= "start_date" class= "form-control" required > </div> <div class= "mb-4 form-group col-lg-4" > <label class= "form-label" > End Date </label> <input type= "text" name= "end_date" id= "end_date" class= "form-control" required > </div> <div class= "mb-4 form-group col-lg-4"…