Create a Custom grid in PHP with Datatable

/***********Create a Custom grid in PHP with Datatable*************/

// Add HTML Code
<table class=”table” id=”tableTestId” cellpadding=”5″ cellspacing=”5″ width=”100%”>
<thead>
<tr>
<th align=”center”>ID</th>
<th align=”center”>Column1</th>
<th align=”center”>Column2</th>
</tr>
</thead>
<tbody>
<?php foreach ($phpResults as $result) { ?>
<tr>
<td align=”center”><?php echo $result[“id”]; ?></td>
<td style=’text-align:center’><?php echo $result[‘column1′] ?></td>
<td style=’text-align:center’><?php echo $result[‘column2’]; ?></td>
</tr>
<?php } ?>
</tbody>
</table>

/******Add jQuery Code for Data tables**********/
Add below scripts to you code to work with Datatables:

https://code.jquery.com/jquery-3.3.1.js
https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js

After adding the above links, use the following:

$(document).ready(function() {
$(‘#tableTestId’).DataTable();
});

That’s it you are done!

 

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s