Are you using the yajra package?
DataTables.js server side processing / AJAX and Laravel
Hey,
I am trying to figure out a way to set up server side processing / AJAX for dataTables.js and Laravel.
I was looking at the PHP example but the code is way too ugly to be understood. Also, I am not using the package.
Anyone have any good real world examples, tips and tricks or specific requirements for this process to work?
I started to use the package but wow, it needs some maintenance. Still calling for Laravel collective 5.0 which has not worked with laravel since I think 5.1
So, I've started just chucking things together last night and its simple enough so far.
Warts and all
Route::get('/json/operators', function(Illuminate\Http\Request $request){
//only sorts by one column
$orderby = $request->input('order.0.column');
$sort['col'] = $request->input('columns.' . $orderby . '.data');
$sort['dir'] = $request->input('order.0.dir');
$query = App\Operator::where('name', 'like', '%'. $request->input('search.value') .'%')
->orWhere('address', 'like', '%'. $request->input('search.value') .'%');
$output['recordsTotal'] = $query->count();
$output['data'] = $query
->orderBy($sort['col'], $sort['dir'])
->skip($request->input('start'))
->take($request->input('length',10))
->get();
$output['recordsFiltered'] = $output['recordsTotal'];
$output['draw'] = intval($request->input('draw'));
return $output;
then in blade;
@section('page-js')
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>
<script>
$(document).ready(function() {
otable = $('#operators').DataTable( {
"ajax": "/json/operators",
"processing":true,
"serverSide":true,
"stateSave":true,
"columns": [
{ "data": "name","class":"small" },
{ "data": "address","class":"small" },
{ "data": "vehicles","class":"small" },
{ "data": "type","class":"small" },
{ "data": "licence","class":"small" },
{ "data": "status","class":"small" },
]
} );
$('#operators tbody').on('click', 'tr', function () {
var data = otable.row( this ).data();
document.location.href = '/operator/'+data['slug'];
});
});
</script>
@endsection
Seems to be working fine against an 80,000 record dataset
Please or to participate in this conversation.