首先介绍下这两个插件功能
1.DataTables是一个jQuery的表格插件。
官方网站及其下载地址：http:/www.datatables.net
其主要特点如下：
2.即时表格数据过滤
3.数据排序以及数据类型自动检测
4.自动处理列宽度
5.可通过CSS定制样式
6.支持隐藏列
7.易用
8.可扩展性和灵活性
9.国际化
10.动态创建表格
11.免费的
2.对话框（dialog），是jQuery UI 非常重要的一个功能。它彻底的代替了JavaScript的alert()、prompt()等方法，也避免了新窗口或页面的繁杂冗余。
我这里直接讲下我需要实现什么样的功能，大家就知道了
对，就是一个非常简单的删除功能，然后弹出对话框，然后点击确定，执行删除。
首先来看下dataTables里面的写法
",oLanguage: {
"sProcessing": "处理中...","sLengthMenu": "显示 _MENU_ 项结果","sZeroRecords": "没有匹配结果","sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项","sInfoEmpty": "显示第 0 至 0 项结果，共 0 项","sInfoFiltered": "(由 _MAX_ 项结果过滤)","sInfoPostFix": "","sSearch": "搜索:","sUrl": "","sEmptyTable": "表中数据为空","sLoadingRecords": "载入中...","sInfoThousands": ",","oPaginate": {
"sFirst": "首页","sPrev@R_502_437@s": "上页","sNext": "下页","sLast": "末页"
},"oAria": {
"sSortAscending": ": 以升序排列此列","sSortDescending": ": 以降序排列此列"
}
},"autoWidth": false,"processing": true,"serverSide": true,"searching": false,ordering: false,"info": true,ajax: function (param,callback,settings) {
var service = $("#service").val();
var params = {
//参数集合
}
$.ajax({
type: "GET",url: "",dataType: "json",data: params,contentType: "application/x-www-form-urlencoded; charset=utf-8",success: function (d) {
if(d!==null){
callback({
//返回的查询结果
recordsTotal: d.pageUtil.total,recordsFiltered: d.pageUtil.total,data: d.pageUtil.list
});
}
}
});
},"columns": [
{"data": "code"},{"data": "name"},//表格所对应的字段
],"columnDefs": [
{
"render": function (data,type,row) {
//这里是替换显示 比如查询结果为1 你可以显示其他的值
if (row.o_status == '0') {
return [
row.o_status = '停用'
].join('');
} else if (row.o_status == '1') {
return [
row.o_status = '启用'
].join('');
} else {
return [
row.o_status = ''
].join('');
}
},"targets": 6
},{
//这一步是追加删除链接
"render": function (data,row) {
return [
"删除"
].join('');
},"targets": 8
}
]
});
接着就是写dailog的配置跟样式
提示">
