jQuery DataTables load large data

Question

How to load large data on databases into jquery datatables?

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

total data on xnod_kode table > 10000 records ???

                <?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++;
                }
                ?>

cage rattler · Accepted Answer · 2013-09-03 22:43:00Z

2

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

If your data varies, and >100,000 records is more of an outlier condition, you may consider using the DataTables scroller plugin: http://datatables.net/extras/scroller/. This creates a far superior user experience and can handle tens of thousands of rows under the right conditions. For optimal performance you'd probably want to remove your default sort from the script and place it in your PHP.

answered Sep 3, 2013 at 22:43

cage rattler

1,58510 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bhavik Chauhan · Accepted Answer · 2014-02-27 05:25:41Z

Here is javascript code under ready function

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

Here is 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",
                "-"
           ]
    ]
}

Mohsen Alizadeh · Accepted Answer · 2013-10-09 16:28:28Z

0

Best way is using ajax to load data.

load data piece by piece

answered Oct 9, 2013 at 16:28

Mohsen Alizadeh

1,60312 silver badges26 bronze badges

Comments

Community · Accepted Answer · 2017-05-23 11:51:20Z

0

One way is to Convert php array to JSON of all records and give it to JS array. Then parse JSON and render it as table.

But the best way is to load some limit of data on page load. and do paging(Using AJAX) either with page number links or on scroll of end of the table.

edited May 23, 2017 at 11:51

CommunityBot

11 silver badge

answered Feb 27, 2014 at 5:36

Jaykishan

1,5191 gold badge17 silver badges27 bronze badges

Collectives™ on Stack Overflow

jQuery DataTables load large data

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related