内联代码

Question

在Jquery Datatable中我试图动态添加行。它是动态添加的，但它不是添加在表格的顶部。

任何人都可以帮我使用Jquery Datatable在表的顶部动态添加行。

这是小提琴http://jsfiddle.net/inDiscover/yo83k3z9/

内联代码

<!DOCTYPE html>
<html>
<head>
<!-- DataTables CSS -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
<!-- jQuery -->
<script type="text/javascript" charset="utf8" src="https://code.jquery.com/jquery-1.7.2.min.js"></script>

<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
var giCount = 1;

jQuery(document).ready( function () {
    jQuery('#table_id').DataTable();
} );

function fnClickAddRow() {
    jQuery('#table_id').dataTable().fnAddData( [
        giCount+".1",
        giCount+".2",
        ] );

    giCount++;
}


</script>
</head>
<body>
<a onClick="fnClickAddRow()">Add Row</a>
<table id="table_id" class="display">
    <thead>
        <tr>
            <th>Column 1</th>
            <th>Column 2</th>
        </tr>
    </thead>
    <tbody>        
    </tbody>
</table>
</body>
</html>

Answer 1

订单由第一列设置。默认情况下，它会按升序排序，因此看起来新内容会附加到表格的底部。如果您将排序顺序更改为降序，它将按您的要求运行：

jQuery('#table_id').DataTable({
    "order": [[ 0, "desc" ]]
});

Updated example

动态添加行不会添加到表的顶部

内联代码

1 个答案: