CODEWITHSUNDEEP
phpjquery
Ega Gilang Ramadhan
Ega Gilang Ramadhan

Reputation: 71

jQuery DataTables load large data

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

Upvotes: 7

Views: 11063

Answers (4)

Jaykishan
Jaykishan

Reputation: 1499

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.

Upvotes: 0

Bhavik Chauhan
Bhavik Chauhan

Reputation: 126

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

Upvotes: 1

Mohsen Alizadeh
Mohsen Alizadeh

Reputation: 1603

Best way is using ajax to load data.

load data piece by piece

Upvotes: 0

cage rattler
cage rattler

Reputation: 1597

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.

Upvotes: 2

Related Questions