datatables动态添加列事件

最新推荐文章于 2022-03-09 17:57:06 发布

asdfg200646

最新推荐文章于 2022-03-09 17:57:06 发布

阅读量2.6k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/u013907169/article/details/50551827

本文介绍如何通过Ajax从服务器获取数据，并使用DataTable插件在网页上展示这些数据。具体包括设置Ajax请求参数、定义数据表格结构及国际化配置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$.ajax({
url:"控制器名称",
type:"GET",
dataType:"JSON",
success:function(data){
// console.log(data);
$('#collegeInfoList').DataTable({
data:data,
"columns":[
{data:"depNum"},
{data:"depName"},
{data:"addTime"},
{data:null,"render": function(data, type, row) {
var html = '<a href="javascript:void(0);" class="delete btn btn-default btn-xs"> 删除</a>'
html += ' <a href="javascript:void(0);" class="up btn btn-default btn-xs"><i class="fa fa-arrow-up"></i> 上升</a>'
html += ' <a href="javascript:void(0);" class="down btn btn-default btn-xs"><i class="fa fa-arrow-down"></i> 下降</a>'
return html;
}
/*defaultContent:'<a href="#" onclick="relatedHandle(this,1)">修改</a>||<a href="#" onclick="relatedHandle(this,1)">删除</a>'*/,
orderable:true},
],
language: {
"processing": "处理中...",
"lengthMenu": "显示 _MENU_ 项结果",
"zeroRecords": "没有匹配结果",
"info": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
"infoEmpty": "显示第 0 至 0 项结果，共 0 项",
"infoFiltered": "(由 _MAX_ 项结果过滤)",
"infoPostFix": "",
"search": "搜索:",
"url": "",
"emptyTable": "表中数据为空",
"loadingRecords": "载入中...",
"infoThousands": ",",
"paginate": {
"first": "首页",
"previous": "上页",
"next": "下页",
"last": "末页"
},
"aria": {
"sortAscending": ": 以升序排列此列",
"sortDescending": ": 以降序排列此列"
}
}
});
}
});