In the previous article i explained what are data tables & what are its features,You can refer it with this link.
Today we are going to learn how we can integrate data table for dynamic table rows.
Before that i will give you a basic introduction on what are datatables.
What is DataTable?
- Data table is a JQuery plugin for creating table related listing and adding connections between them.
- In simple when we create a bootstrap table, only the record of table are shown rather than search,pagination,filter etc.
- So to make a table user friendly and easy Data Tables are used.
- With this datatable we no need to create pagination,search or anything, just with a few lines of script you table is ready.
- One we write script we have following features automatically.
Now lets check the integration in Core PHP .
Datatable integration in core PHP
STEP 1 :
- Add stylesheet & script links for datatable plugin to work.
- Create a PHP file with name data.php, create a table, update columns & provide a unique id for table.
- keep tbody as empty.
STEP 2 :
In the same file data.php write the script for data tables where we will use ajax .
- Here #usersList is the id i gave for my table.
- aAjaxSourse is the page where i write query.
- Length Menu is the filters i want to use
- Left array indicates the count
- Right array indicates the names of count visible to user.
- If you use -1 it indicates to show all data.
STEP 3 :
Create another PHP file with name query.php and write the query to get data .
STEP 4 :
In the same file query.php we need to push the data in an array to paas to data tables.
$totalFiltered = $getUsersList; $data=array(); if(isset($getUsersList)): $i=1;foreach($getUsersList as $users): $nestedData=array(); $nestedData = $i; $nestedData = $users["Firstname"].' '.$users["Lastname"]; $nestedData = $users["Bib"]; $nestedData = $users["Event"]; $nestedData = $users["Gender"]; $nestedData = $users["Laps"]; $data = $nestedData; $i++;endforeach; $json_data = array( "recordsTotal" => intval( sizeof($getUsersList) ), "recordsFiltered" => intval( $totalFiltered ), "data" => $data ); echo json_encode($json_data); endif;
That’s it as soon as you push the data in the array and convert it to json_encode and load your page the data table is integrated and data will be shown with pagination,filter and length.
Your output be something like this.
Hope this article helps you and save your time.Do comment your views and share with your friends & colleagues
For more updates:
Follow us on our Facebook page :
Do Follow my Instagram page for more updates :