datatable1.9 与datatable1.10以数据差异
2015-08-06 17:09
253 查看
我还探讨datatable1.10新用途,如果在下面的代码中的错误,欢迎。。
1.10与1.9解释官方网站之间的差异:http://www.datatables.net/upgrade/1.10
看代码。先看1.9的写法:
$(document).ready(function() {
var table, _qData;
table = $('#example').dataTable({
aoColumns : _tableCols,
fnCreatedRow : xxxxx, //函数名
});
loadList();
});
// table: 表格对象
function loadList() {
$.ajax({
url : '/queryxxxx',
data : _qData,
dataType : 'json',
success : function(data) {
table.fnClearTable();
table.fnAddData(data.records);
}
});
}
var _tableCols = [ {
mData : null,
bSortable : false,
sClass : "center",
sWidth : "30",
mRender :xxxx //函数名
}, {
mData : 'groupCode',
sWidth : "120",
bSortable : true
}, {
mDataProp : "uuid",
sClass : "center",
bSortable : false,
sWidth : "124",
mRender : xxxx //函数名
} ];
如今看1.10的写法
$(document).ready(function() {
var table, _qData;
table = $('#example').dataTable({
"columns" : _tableCols,
"createdRow" : xxxxx, //函数名
});
loadList();
});
// table: 表格对象
function loadList() {
$.ajax({
url : '/queryxxxx',
data : _qData,
dataType : 'json',
success : function(data) {
table.clear().draw();
table.rows.add(data.records).draw();
}
});
}
var _tableCols = [ {
data: null,
orderable: false,
className : "center",
width : "30",
render :xxxx //函数名
}, {
data : 'groupCode',
width : "120",
orderable: true
}, {
data: "uuid",
className : "center",
orderable: false,
width : "124",
render : xxxx //函数名
} ];
我们在看一种1.10的写法。
此时我们将Ajax放在datatable里面
var table= $('#example').dataTable({
"columns" : _tableCols, //_tableCols 写法同上
createdRow : xxxxx, //该函数用于行事件
"ajax" : {
"url" : "xxxxx",
"type" : "POST",
"dataSrc" : function(json) {
return json.records;
},
"error" : function() {
var data = {
"data" : []
};
return data;
}
}, });
该种方式也能给datatable赋值。
。。
。
用mDataProp绑定字段 跟mdata 一样的使用方法,这两个都是datatable 1.9及曾经使用方法。1.10之后统一用data了。
1.9 -----》 1.10
mdata mdataprop -->data
bSortable -->orderable
sClass -->className
swidth -->width
mRender -->render
fnCreatedRow -->createdRow
datatables warning table id requested unknown parameter from the data source for row
(说明:The reason for these warnings are normally due to null values in the data source. The key to suppressing this warning is through the use of the sDefaultContent property.)
以下代码也能略微解决:
1. "aoColumnDefs" : [ {
sDefaultContent : '',
aTargets : [ '_all' ]
} ],
2.
add
搜索 datatable 1.10 ajax
1.10与1.9解释官方网站之间的差异:http://www.datatables.net/upgrade/1.10
看代码。先看1.9的写法:
$(document).ready(function() {
var table, _qData;
table = $('#example').dataTable({
aoColumns : _tableCols,
fnCreatedRow : xxxxx, //函数名
});
loadList();
});
// table: 表格对象
function loadList() {
$.ajax({
url : '/queryxxxx',
data : _qData,
dataType : 'json',
success : function(data) {
table.fnClearTable();
table.fnAddData(data.records);
}
});
}
var _tableCols = [ {
mData : null,
bSortable : false,
sClass : "center",
sWidth : "30",
mRender :xxxx //函数名
}, {
mData : 'groupCode',
sWidth : "120",
bSortable : true
}, {
mDataProp : "uuid",
sClass : "center",
bSortable : false,
sWidth : "124",
mRender : xxxx //函数名
} ];
如今看1.10的写法
$(document).ready(function() {
var table, _qData;
table = $('#example').dataTable({
"columns" : _tableCols,
"createdRow" : xxxxx, //函数名
});
loadList();
});
// table: 表格对象
function loadList() {
$.ajax({
url : '/queryxxxx',
data : _qData,
dataType : 'json',
success : function(data) {
table.clear().draw();
table.rows.add(data.records).draw();
}
});
}
var _tableCols = [ {
data: null,
orderable: false,
className : "center",
width : "30",
render :xxxx //函数名
}, {
data : 'groupCode',
width : "120",
orderable: true
}, {
data: "uuid",
className : "center",
orderable: false,
width : "124",
render : xxxx //函数名
} ];
我们在看一种1.10的写法。
此时我们将Ajax放在datatable里面
var table= $('#example').dataTable({
"columns" : _tableCols, //_tableCols 写法同上
createdRow : xxxxx, //该函数用于行事件
"ajax" : {
"url" : "xxxxx",
"type" : "POST",
"dataSrc" : function(json) {
return json.records;
},
"error" : function() {
var data = {
"data" : []
};
return data;
}
}, });
该种方式也能给datatable赋值。
。。
。
用mDataProp绑定字段 跟mdata 一样的使用方法,这两个都是datatable 1.9及曾经使用方法。1.10之后统一用data了。
1.9 -----》 1.10
mdata mdataprop -->data
bSortable -->orderable
sClass -->className
swidth -->width
mRender -->render
fnCreatedRow -->createdRow
datatables warning table id requested unknown parameter from the data source for row
(说明:The reason for these warnings are normally due to null values in the data source. The key to suppressing this warning is through the use of the sDefaultContent property.)
以下代码也能略微解决:
1. "aoColumnDefs" : [ {
sDefaultContent : '',
aTargets : [ '_all' ]
} ],
2.
add
$.fn.dataTableExt.sErrMode = 'throw'in the page where the plugin is used
搜索 datatable 1.10 ajax
相关文章推荐
- 启示—地点IT高管20在职场心脏经(读书笔记6)
- Rendering Problems:android.support.v7.internal.widget.ActionBarOverlayLayout 解决方法
- 浅谈容器
- sgu 180 - Inversions (离散化+树状数组)
- 15期.net 博客汇总
- bootstrap模态框打开报错
- jQuery几个重要的实际应用技巧
- NavigationBar的第二中方法,图片变色,文字不变色
- ffmpeg 怎么用
- P - 奔小康赚大钱 - hdu 2255(带权值的匹配)
- mongodb查询的语法(大于,小于,大于或等于,小于或等于等等)
- ant打包
- UVA 639 Don't Get Rooked
- poj-1125 Stockbroker Grapevine
- Android 自定义View 视频音量调控
- SPOJ NWERC11E Please, go first
- 树的子结构
- 动软代码生成器 可用于生成Entity层,可更改模板 /codesmith 也可以
- 可能性dp+减少国家HDU4336
- 好用的工具---screen命令