JQuery DataTables loads big data

Question

How to load big database data in jQuery datatables?

$(document).ready(function(){ $('#datatables').dataTable({ "sPaginationType":"full_numbers", "aaSorting": [[0, 'asc'], [1, 'desc']], "sScrollY": "200px", "bJQueryUI":true }); }) 

xnod_kode table total data> 10,000 entries

  <?php $result = mysql_query("SELECT * FROM xnod_kode limit 10"); $no = 1; while ($row = mysql_fetch_array($result)) { ?> <tr> <td><?php echo $no; ?></td> <td><?php echo $row['kodepos']?></td> <td><?php echo $row['kelurahan']?></td> <td><?php echo $row['kecamatan']?></td> </tr> <?php $no++; } ?> 

Answer 1

In general, DataTables handles very large amounts of data best by paginating and fetching data through AJAX: http://datatables.net/examples/data_sources .

If your data is different, a> 100,000 records is more likely an exception condition, you can use the DataTables scroller plugin: http://datatables.net/extras/scroller/.This creates a much higher user interface and can process tens of thousands of lines when the right conditions. For optimal performance, you probably want to remove the default sort from the script and put it in your PHP.

Answer 2

Here is the javascript code under the finished function

 $('#myDatatable').dataTable({ sAjaxSource : 'jsonfiledemo.txt' }); 

Here is the html table

 <table id="myDatatable"> <thead> <tr> <th>data heading 1</th> <th>data heading 2</th> <th>data heading 3</th> </tr> </thead> <tbody> </tbody> 

jsonfiledemo.txt jsone file

  { "sEcho": 0, "iTotalRecords": "34635", "iTotalDisplayRecords": "34635", "aaData": [ [ "title1", "another handling...", "Authored" ], [ "new title", "Cookies are used to track valid session on internet websites. another...", "Authored", "-" ] ] } 

Answer 3

The best way is to use ajax to load the data.

Downloading data in parts

Answer 4

One way is to Convert php array to JSON from all records and pass it to JS array . Then parse the JSON and take it as a table.

But the best way is to load some data limit when loading the page. and swap (using AJAX ) either with links to page numbers or scrolling through the end of the table.