Today, We want to share with you PHP Laravel Datatable Server Side Processing using jQuery Ajax.In this post we will show you Datatables Server Side Processing in Laravel 5.7, hear for datatables Laravel server-side processing in codeigniter using ajax we will give you demo and example for implement.In this post, we will learn about jQuery Datatable Server Side Processing With Custom Operations using Laravel with an example.
PHP Laravel Datatable Server Side Processing using jQuery Ajax
There are the Following The simple About PHP Laravel Datatable Server Side Processing using jQuery Ajax Full Information With Example and source code.
As I will cover this Post with live Working example to develop Laravel server side processing for Datatables, so the laravel 5.7 datatables package for this example is following below.
Step 1: include Datatables CSS file and Javascript files from CDN
Step 2: HTML table in Laravel Blade File
Here are the steps to be followed for Implement datatables server side processing Laravel
Let the Laravel blade view page be datatable.blade.php. Your HTML Data table columns may be all the different but the step by step (laravel datatables tutorial) here.
List of The All Articles Title
Id | Title | Action |
---|
Step 3: javascript Source code
And then call simple Laravel Ajax using javascript source code given below. This ajax will automatically call action when you load your page.Below we can ajax request source code. Put this laravel datatables ajax source code to your Laravel blade view page of laravel at the bottom with laravel datatables pagination.
$(document).ready(function () { $('#article_datatables').DataTable({ "processing": true, "serverSide": true, "ajax":{ "url": "/fetch_all_articles’", "dataType": "json", "type": "POST", "data":{ _token: "{{csrf_token()}}"} }, "columns": [ { "data": "id" }, { "data": "title" }, { "data": "action" } ] }); });
Step 4: Laravel Define Route
Put Laravel Route in your web.php files
And then we want set Laravel route for this method, so we have to go to routes/web.php file and write following source code for set route for index method.
Route::post(‘/fetch_all_articles’,’ArticleController@fetchAllArticles)
Step 5: Source code for fetchAllArticles function in ArticleController
jQuery Live Server side Datatable for pagination, records and search filters in laravel datatable server side.
public function fetchAllArticles(Request $request) { $columns = array( 0 => 'id', 1 => 'title', ); $totalTitles = Article::where('deleted_at', '=', null) ->count(); $totalFiltered = $totalTitles; $limit = $request->input('length'); $start = $request->input('start'); $order = $columns[$request->input('order.0.column')]; $page_dir = $request->input('order.0.dir'); if (empty($request->input('search.value'))) { $titles = Article::where('deleted_at', '=', null) ->offset($start) ->limit($limit) ->orderBy($order, $page_dir) ->get(); } else { $string_search = $request->input('search.value'); $titles = Article::where('title', 'LIKE', "%{$string_search}%") ->where('deleted_at', '=', null) ->offset($start) ->limit($limit) ->orderBy($order, $page_dir) ->get(); $totalFiltered = Article::where('title', 'LIKE', "%{$string_search}%") ->where('deleted_at', '=', null) ->count(); } $all_products_data = array(); if (!empty($titles)) { $count = 1; foreach ($titles as $title) { $nestedData['id'] = $count; $nestedData['title'] = $titles->title; $nestedData['action'] = ' '; $all_products_data[] = $nestedData; $count++; } } $product_data = array( "draw" => intval($request->input('draw')), "recordsTotal" => intval($totalTitles), "recordsFiltered" => intval($totalFiltered), "data" => $all_products_data, ); echo json_encode($product_data); }
Code Understanding
$request – In this case by default all datatables parameters are gets that are sent by jquery ajax serever side datatable.
$totalTitles – totalTitles are the sum all thr count that will be used for Ajax call jquery Datatables pagination in your Laravel Serverside datatable.
$limit – page data record limit is the set variable that init mode number of data records to be get at a time. ( No of total data records to display on page one )
Angular 6 CRUD Operations Application Tutorials
Read :
Summary
You can also read about AngularJS, ASP.NET, VueJs, PHP.
I hope you get an idea about PHP Laravel Datatable Server Side Processing using jQuery Ajax.
I would like to have feedback on my Pakainfo.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.