Question

基本上代码工作正常，只是当数据变得越来越大时，加载速度变得非常慢。

任何人都可以建议如何提高加载速度？

以下是我的代码：

的Javascript

<script type="text/javascript">
$(document).ready(function() {
    $('#example').dataTable({
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "aoColumnDefs": [{
                'bSortable': false,
                'aTargets': [0]
            }]
    });

});
</script>

数据表：

<table class="list" id="example">
    <thead>
        <tr>
            <td class="first" width="1" style="text-align: center;"><input type="checkbox" onclick="$('input[name*=\'selected\']').prop('checked', this.checked);"></td>
            <td class="left">Location ID</td>
            <td class="left">Location</td>
            <td class="left">Issued By</td>
            <td class="left">Supervise by Role</td>
            <td class="right">Action</td>
        </tr>
    </thead>
    <tbody>
    <?php
    $sql = "SELECT * FROM location";
    $query = mysql_query($sql) or die(mysql_error());
    if (mysql_num_rows($query) > 0) {
        while ($data = mysql_fetch_assoc($query)) {
            ?>
            <tr>
                <td style="text-align: center;"><input type="checkbox" name="selected[]" value="<?php echo $data['locationname']; ?>">
                </td>
                <td class="left"><?php echo $data['lid']; ?></td>
                <td class="left"><?php echo $data['locationname']; ?></td>
                <td class="left"><?php echo $data['issuedby']; ?></td>
                <td class="left"><?php echo "Supervisor - " .  $data['locationname']; ?></td>
                <td class="right"> [ <a href="index.php?cmd=location&route=location&fn=view&lid=<?php echo $data['lid']; ?>">View</a> ] [ <a href="index.php?cmd=location&route=location&fn=edit&lid=<?php echo $data['lid']; ?>">Edit</a> ]</td>
            </tr>
            <?php
        }
    }
    ?>
    </tbody>
</table>

Answer 1

如果您的数据集很大，您应该使用AJAX以块的形式加载数据。

以下链接可以从中获取有关向数据表添加新行的信息：

http://www.datatables.net/examples/api/add_row.html

如示例中所示，datatable将处理分页和排序本身。

提高datatable.js大规模数据的加载速度

1 个答案: