这个还要从很久很久之前说起……
首先要说的是 Datatables 提供了两个 api 来添加新的行，一个是
row.add()API
,一个是
rows.add()API
前者是单行添加，后者是多行添加，那么先看下面的代码，看看我们是怎么添加一行到表格中的 下面是表格初始化代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var oTable02 = $('#inlineEditDataTable').DataTable({
"columnDefs": [
{'title': "Priority", 'targets': 0},
{'title': "Item", 'targets': 1},
{'title': "Type", 'targets': 2},
{'title': "Background-color", 'targets': 3}
],
"order": [[0, "des"]],
"columns": [
{"data": "priority"},
{"data": "name"},
{"data": "type"},
{"data": "color"}
],
"ajax":"json.json"
});
往表格里添加一行或者多行
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
//单独添加一行
var singlerow = {
"id": 1,
"name": "DataTables 中文网",
"type": 1,
"color": "white",
"priority": 1
};
oTable02.row.add(singlerow);
//同时添加多行
var rows = [{
"id": 1,
"name": "DataTables 中文网 api",
"type": 1,
"color": "white",
"priority": 2
},
{
"id": 1,
"name": "DataTables 中文网 不定时一讲",
"type": 1,
"color": "white",
"priority": 3
}];
oTable02.rows.add(rows);
这个时候大家遇到的问题就是，怎么都往后面追加了，要是有2页的话，不翻页还不知道这行已经添加进去了
先别急，我们先看看这个例子 添加行 API 示例 Datatables中文网
不用怀疑，如果你操作了这个例子，你心中肯定想的是，添加新行就是往后追加的
不！我一开始也是这么认为的，直到我写首页的例子后，发现有时候添加的新行居然在表格中间，我暗自笑了笑，“哈哈居然还有bug”
但是后面我发现不对，于是我开始查询资料，皇天不负有心人，终于让我知道是怎么回事了。
作者在论坛里说到
Datatables 的数据位置是由 sort 控制的，如果你希望新加入的行在表格最上面，那么你的数据排序（升序）就必须要在最上面
看到这句话的时候，我大概明白了，我马上去用代码做了实验证明自己的想法。
“实践是检验真理的唯一标准”这话一点都不假，如果光有想法不实践，只做而又不去思考都是不行的，咦？不对，我是不是跑题了？ 好我们说正事，那么根据我上面说的屁话，可以知道如果要想新加入的行在表格的最上方，只要在数据上稍作处理即可。
看下面代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
var oTable02 = $('#inlineEditDataTable').DataTable({
"columnDefs": [
{'title': "Priority", 'targets': 0},
{'title': "Item", 'targets': 1},
{'title': "Type", 'targets': 2},
{'title': "Background-color", 'targets': 3}
],
//这里之所以写出来，是大家需要注意的，因为dt的的默认值为[[0, 'asc']]
//所以上面提到的 添加行的例子 操作的结果是在后面追加
//因为默认第一列升序排列，所以根据代码，新加的行第一列是累加的，那么越来越大，升序的话当然往后面排啊
"order": [[0, "des"]],
"columns": [
{"data": "priority"},
{"data": "name"},
{"data": "type"},
{"data": "color"}
],
"ajax":"json.json"
});
//针对这个代码示例，先假设表格中已经有一行数据【 0 中文网 1 white 】，我新加的行要在他上面，代码这样写
var singlerow = {
"id": 1,
"name": "我在最上面",
"type": 1,
"color": "white",
"priority": 1
};
oTable02.row.add(singlerow);
这里需要注意的地方就是，我给出的代码示例设置了第一列降序排列，第一列是 priority， 那么只要新加行 priority 比已有行 priority 要大 即可。
