- jQuery(function($) {
- var oTable1 = $("#sample-table-2").DataTable({
- "language": {
- "sProcessing": "处理中...",
- "sLengthMenu": "显示 _MENU_ 项结果",
- "sZeroRecords": "没有匹配结果",
- "sInfo": "显示第 _START_ 至 _END_ 项结果, 共 _TOTAL_ 项",
- "sInfoEmpty": "显示第 0 至 0 项结果, 共 0 项",
- "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
- "sInfoPostFix": "",
- "sSearch": " 搜索:",
- "sUrl": "",
- "sEmptyTable": "表中数据为空",
- "sLoadingRecords": "载入中...",
- "sInfoThousands": ",",
- "oPaginate": {
- "sFirst": "首页",
- "sPrevious": "上页",
- "sNext": "下页",
- "sLast": "末页"
- },
- "oAria": {
- "sSortAscending": ": 以升序排列此列",
- "sSortDescending": ": 以降序排列此列"
- }
- },
- "sPaginationType": "ellipses",
- // 页数过多时显示.., 需引入对应文件
- "stateSave": false,
- // 状态保存 (cookie 里), 开启会导致刷新后显示上一次的内容
- "autoWidth": false,
- // 自动宽度
- "aLengthMenu": [10, 15, 20, 30, 50],
- "serverSide": true,
- // 服务器模式, 使用 ajax 必须开启
- "bPaginate": true,
- // 分页总开关
- "pagingType": "full_numbers",
- // 分页样式
- "searchable": true,
- // 搜索总开关
- "ordering": true,
- // 排序总开关
- // "order":[[4,"desc"],[5,"desc"]],
- "orderFixed": {
- "post": [[4, "desc"], [5, "desc"]]
- },
- // 固定排序, 下面讲
- "bDestroy": true,
- "ajax": function(data, callback, settings) {
- // 参数封装
- var param = {};
- param.draw = data.draw;
- param.limit = data.length; // 页面显示记录条数, 在页面显示每页显示多少项的时候
- param.start = data.start; // 开始的记录序号
- param.page = (data.start / data.length) + 1;
- param.filter = data.search.value; // 过滤条件
- // alert(JSON.stringify(data));
- alert(JSON.stringify(data.order))
- // 单排序条件
- /* if(data.order) {
- if(data.order[0].dir) {
- param.order = "releaseTime" + " " + data.order[0].dir;
- }
- } *$/ 多排序条件
- param.order = " ";
- if (data.order) {
- $.each(data.order,
- function(index, value) {
- var col = data.order[index].column;
- $.each(data.columns,
- function(i, v) {
- var name = data.columns[i].name;
- if (name) {
- if (col == window.parseInt(name)) {
- var arr = name.split("_");
- param.order += arr[1] + ""+ data.order[index].dir +",";
- }
- }
- })
- })
- }
- param.order = param.order.substring(0, param.order.length - 1);
- $.ajax({
- type: "POST",
- url: "${pageContext.request.contextPath}/newsController/getAllNews.action",
- data: param,
- cache: false,
- dataType: "json",
- success: function(result) {
- var returnData = {};
- returnData.draw = result.draw; // 这里直接自行返回了 draw 计数器, 应该由后台返回
- returnData.recordsTotal = result.recordsTotal; // 返回数据全部记录
- returnData.recordsFiltered = result.recordsFiltered; // 后台不实现过滤功能, 每次查询均视作全部结果
- // 更改时间格式
- for (var i = 0; i <result.data.length; i++) {
- result.data[i].releaseTime = new Date(result.data[i].releaseTime).toLocaleDateString();
- }
- returnData.data = result.data; // 返回的数据列表
- // 回调函数 (数据渲染)
- callback(returnData);
- },
- error: function(ajax, textStatus) {
- /* alert(JSON.stringify(ajax));
- alert(textStatus); */
- alert("未找到数据");
- }
- })
- },
- "columnDefs": [{
- "targets": [0],
- "render": function(data, type, row, meta) {
- return '<label><input type="checkbox"class="ace"/><span class="lbl"></span></label>';
- },
- "orderable": false,
- "width": "50px"
- },
- {
- "title": "序号",
- "name": "1_id",
- "data": "id",
- "targets": [1],
- "width": "50px",
- "orderable": false,
- },
- {
- "title": "新闻标题",
- "name": "2_title",
- "data": "title",
- "targets": [2],
- "render": function(data) {
- if (data.length > 25) {
- data = data.substring(0, 25) + "...";
- }
- return data;
- },
- "orderable": false,
- "width": "400px"
- },
- {
- "data": null,
- "targets": [3],
- "visible": false,
- "searchable": false,
- "orderable": false
- },
- {
- "title": "发布时间",
- "name": "4_releaseTime",
- "data": "releaseTime",
- "targets": [4],
- "width": "300px",
- "orderable": true,
- // "orderSequence":["asc","desc"],// 排序方向, 第一次点击升序, 第二次点击降序
- // "orderData":[4,5],// 第 5 列数据相同时安按照第 6 列数据进行排序
- },
- {
- "title": "所在板块",
- "name": "5_smallId",
- "data": "menu.name",
- "targets": [5],
- "width": "300px",
- "orderable": true,
- "orderData": [5],
- },
- {
- "title": "操作",
- "targets": [6],
- "render": function(data, type, row, meta) {
- var newsId = row.id;
- //<a class="green" data-toggle="tooltip" data-placement="top" title="查看详细" href="#"><i class="icon-pencil bigger-130"></i></a>
- return '<div class="visible-md visible-lg hidden-sm hidden-xs action-buttons"><a class="blue"data-toggle="tooltip"data-placement="top"title=" 查看详细 "href="#"><i class="icon-zoom-in bigger-130"></i></a> <a class="red"data-toggle="tooltip"data-placement="top"title=" 删除 "href="#"><i class="icon-trash bigger-130"></i></a></div><div class="visible-xs visible-sm hidden-md hidden-lg">';
- },
- "orderable": false,
- "width": "200px"
- }], "infoCallback": function(settings, start, end, max, total, pre) {
- // 激活工具提示
- $("[data-toggle='tooltip']").tooltip();
- // 图标功能
- $("#sample-table-2 tbody").on('click', 'tr',
- function() {
- var id = $(this).find("td").eq(1).text();
- if (id) {
- $(".blue").attr("href", "${pageContext.request.contextPath}/newsController/edit.action?id=" + id);
- }
- });
- $(".red").click(function() {
- $(this).parents("tr").find("td").eq(0).find(":checkbox").attr("checked", true);
- var ids = new Array();
- // 添加 id 到数组
- $(":checkbox:checked").each(function(i) {
- if ($(this).parents("tr").find("td").eq(1).text()) {
- ids[i] = $(this).parents("tr").find("td").eq(1).text();
- }
- }) if (window.confirm("确定要删除吗?")) {
- if (ids.length > 0) {
- $.ajax({
- type: "POST",
- url: "${pageContext.request.contextPath}/newsController/hide.action",
- data: {
- "ids": ids
- },
- traditional: true,
- success: function() {
- window.location.reload();
- }
- })
- }
- }
- });
- var api = this.api();
- var pageInfo = api.page.info();
- // alert(JSON.stringify(pageInfo));
- return "共" + pageInfo.pages + "页, 当前显示" + start + "到" + end + "条记录" + ", 共有" + total + "条记录";
- },
- "drawCallback": function(settings) {
- // 去除第一列排序图标
- // $("#th1").removeClass("sorting_asc");
- /* var th4 = $("#th4").attr("aria-sort");
- var th5 = $("#th5").attr("aria-sort");
- if(th4){
- if(th4 == "ascending") {
- if($("#th4").hasClass("sorting_desc")){
- $("#th4").removeClass("sorting_desc");
- $("#th4").addClass("sorting_asc");
- }
- }else {
- if($("#th4").hasClass("sorting_asc")){
- $("#th4").removeClass("sorting_asc");
- $("#th4").addClass("sorting_desc");
- }
- }
- }
- if(th5){
- if(th5 == "ascending") {
- if($("#th5").hasClass("sorting_desc")){
- $("#th5").removeClass("sorting_desc");
- $("#th5").addClass("sorting_asc");
- }
- }else {
- if($("#th5").hasClass("sorting_asc")){
- $("#th5").removeClass("sorting_asc");
- $("#th5").addClass("sorting_desc");
- }
- }
- } */
- },
- });
- // 搜索框样式
- //$("#sample-table-2_filter input[type='search']").val("");
- var search = "<div class='input-group'><input type='search'class='form-control input-sm'placeholder='标题检索'aria-controls='sample-table-2'><div class='input-group-addon'><span class='glyphicon glyphicon-search'id='search'></span></div></div>";
- $("#sample-table-2_filter label").html(search);
- $(".glyphicon-search").CSS("cursor", "pointer");
- var table = $("#sample-table-2").DataTable();
- //table.columns.adjust();
- //table.order([4,"desc"],[5,"desc"]).draw();
- // 过滤条件
- $("#sample-table-2_filter #search").on("click",
- function() {
- var filter = $(this).parents("div").find("input[type='search']").val();
- table.search(filter).draw();
- });
- // 监听页码
- /* $("#sample-table-2").on("page.dt",function() {
- var tableSetings=$("#sample-table-2").dataTable().fnSettings();
- var length=tableSetings._iDisplayLength;// 当前每页显示多少
- var start=tableSetings._iDisplayStart;// 当前页开始
- } ); */
来源: https://www.cnblogs.com/tele-share/p/8667434.html