Skip to main content

DataTable with PHP and MySQL

Data representation in form of tables and grid is one of the most import web component. Generally we need to perform sorting, pagination on it, which is very complex task to do. To solve this problem, many grid view framework are there. Well, among these frameworks, DataTable is most popular. Features like open source, light weighted, highly flexible and customizable, features like AutoFill, inline editor, sticky header, responsiveness, bootstrap support and foundation are the reasons behind its popularity.

In basic initialization datatable provides pagination, sorting, instant searching by loading whole data records at once. It can be a performance issue fetching large amount of data from server side. It will be better if you integrate server side pagination, searching and sorting, so we can break large amount data in chunk, So performance will increase significantly.

Let’s have a look about using and customizing it. We need to include plugin files (js & css) and fetch data from MySQL database using php.

$(document).ready(function() {
 var dataTable = $('#employee-grid').DataTable( {
  "processing": true,
  "serverSide": true,
  "ajax":{
   url :"employee-grid-data.php", // json datasource
   type: "post",  // method  , by default get
   error: function(){  // error handling
    $(".employee-grid-error").html("");
    $("#employee-grid").append('<tbody class="employee-grid-error"><tr><th colspan="3">No data found in the server</th></tr></tbody>');
    $("#employee-grid_processing").css("display","none");
    
   }
  }
 } );
});

You can download the source code from here and if you get any problem while understanding or implementing it, feel free to ask in the comment section.
Labels:

Comments

Post a Comment

Popular posts from this blog

Magento2 Installation Guide: Part 1

Magento is one of the most powerful eCommerce based CMS available in market. Well, maintaining its awesomeness, the magento officials has released Magento 2.x (e.g. 2.0, 2.0.1 etc.). The beginners may face some issue while installing Magento2. So, here is the prefect guide to help them out. Note: You need PHP 5.6+ to install Magento2 There are multiple ways to install Magento2. You can find more details here . We will look into the 2 easiest methods .i.e. Via Terminal/SSH Via FTP 1. Installation Via Terminal/SSH There are two git repository which can be used for installation: https://github.com/magento/magento2 https://github.com/magento/magento2-community-edition But the first one is recommended for developers. Now, in order to install Magento2 via Terminal/SSH, continue with following steps: Cloning the Git Repository and Setting Up Composer Create a new directory for the installation or go to your apache root directory. You may use the command: ...
Post a Comment
Read more

Magento 2.x Troubleshooting Guide

The developers make every effort to ensure their Magento extensions are stable, reliable, and well-tested. However, due to the highly-customizable nature of Magento they cannot anticipate every possible configuration and so incompatibilities may arise. This guide gives an overview of the most common issues are found on client’s sites and how to resolve them. The purpose of this document is to help the magento2 users in solving the commonly faced issues while installation and usage of Magento 2.x Extensions. The purpose of this document is to help the magento2 users in solving the commonly faced issues while installation and usage of Magento 2.x Extensions. The most common methods of troubleshooting are as follows: Refreshing the Cache. Reindexing the Magento Solving 404 error on System Configuration Permission issues on new extension Disable Maintenance Mode if your Extension is not installed successfully Disable the newly installed Extension if your Magento store stops...
Post a Comment
Read more

5 Tips To Code Like A Pro

Writing code for a web app or software is the most important part of Development Life Cycle. The coder needs to organize everything from the beginning – especially for enterprise level projets. If it’s not properly organized, the coding processes and code management afterwards may end up not just time consuming, but also a bit frustrating. Well written code is maintainable, reusable, and testable. Following tips will help you to code like a pro: 1. Follow Coding Standards It’s easy to unorganized code, but it’s hard to maintain such code. Good code typically follows some standard for naming conventions, formatting, etc. Such standards are nice because they make things deterministic to those who read your code afterwards, including yourself. You can create your own coding standard, but it’s better to stick to one with wider-acceptance. Publicly maintained standards like Zend Framework Coding Standard or PSR-1 Coding Style Guide , it will be easier for others to adapt. 2. Wr...
Post a Comment
Read more