Wizzer.cn

Html：

姓名状态是否在线操作



用户名

datatables初始化：

var datatable;
  function initDatatable() {
    datatable = $('.datatable').DataTable({
      "processing": false,
      "serverSide": true,
      "select": true,
      "ordering": true,
      "language": {
        "url": "/plugins/datatables/cn.json"
      },
      "preDrawCallback": function () {
        sublime.closeLoadingbar($(".main-content"));
        sublime.showLoadingbar($(".main-content"));
      },
      "drawCallback": function () {
        sublime.closeLoadingbar($(".main-content"));
      },
      "ajax": {
        "url": "/private/sys/user/data",
        "type": "post",
        "data": function (d) {
          d.unitid = $('#unitid').val();
          d.loginname=$('#loginname').val();
          d.nickname=$('#nickname').val();
        }
      },
      "order":[[0,"desc"]],
      "columns": [
        {"data": "loginname", "bSortable": true},
        {"data": "nickname", "bSortable": true},
        {"data": "disabled", "bSortable": true},
        {"data": "online", "bSortable": true}
      ],
      "columnDefs": [
        {
          "render": function (data, type, row) {
            return 'html.....';
          },
          "targets": 4
        },
        {
          "render": function (data, type, row) {
            if (data) {
              return '';
            } else {
              return '';
            }
          },
          "targets": 3
        },
        {
          "render": function (data, type, row) {
            if (!data) {
              return '';
            } else {
              return '';
            }
          },
          "targets": 2
        }
      ]
    });
    datatable.on('click', 'tr', function () {
      $(this).toggleClass('selected');
    });
    $("#searchBtn").on('click',function(){
      datatable.ajax.reload(null, false);
    });
  }

重新加载数据：

datatable.ajax.reload(null, false);//当前页
datatable.ajax.reload();//回到第一页

排序：通过后台参数 order数组得到dir:asc/desc，通过order的column下标，获取columns数组中的data字段名，两者结合写排序条件
后台把所有参数打印出来，你就知道代码应该怎么写了……over

响应的数据格式：

{
              "draw": draw,
              "recordsTotal": pageSize,
              "recordsFiltered": count,
              "data": list
            }

Nodejs 后端完整代码：

data: function (req, res) {
    var pageSize = parseInt(req.body.length);
    var start = parseInt(req.body.start);
    var page = start / pageSize + 1;
    var draw = parseInt(req.body.draw);
    var unitid = req.body.unitid || 1;
    var loginname = req.body.loginname || '';
    var nickname = req.body.nickname || '';
    var order = req.body.order || [];
    var columns = req.body.columns || [];
    var sort = {};
    var where = {unitid: unitid};
    if (loginname) {
      where.loginname = {'like':'%'+loginname+'%'};
    }
    if (nickname) {
      where.nickname = {'like':'%'+nickname+'%'};
    }
    if (order.length > 0) {
      sort[columns[order[0].column].data] = order[0].dir;
    }
    Sys_user.count(where).exec(function (err, count) {
      if (!err && count > 0) {
        Sys_user.find(where)
          .sort(sort)
          .paginate({page: page, limit: pageSize})
          .exec(function (err, list) {
            return res.json({
              "draw": draw,
              "recordsTotal": pageSize,
              "recordsFiltered": count,
              "data": list
            });
          });
      } else {
        return res.json({
          "draw": draw,
          "recordsTotal": pageSize,
          "recordsFiltered": 0,
          "data": []
        });
      }
    });
  },