• 记录下这两天学习jquery的dataTable插件的用法


    $("#example").dataTable(// 这个example就是table的id了,这个table要含有thead和tbody才可以的标准table
    {
    "bJQueryUI": true,//这个是一种ui样式,设置为true之后,在把相对应得css image 拷贝到自己的目录里就可以了

    "aaSorting": [[1, "asc"]],//列表排序,数组下表从0开始,1是指第二列
    //"sScrollY": 400,//纵向滚动条 如果表格超过这个高度,就会出现总想滚动条了
    //操作按钮位置
    //"sDom": '<"top"iflp<"clear">>rt',//这是他们自定义个的一个按钮排列顺序和位置,这个具体代表什么含义,demo里面有介绍
    //语言翻译 ,所有的本地翻译都可以通过这个来完成,还可以自定义一个txt文档,通用。
    "oLanguage": {
    "sSearch": "搜索:",
    "sLengthMenu": "每页显示 _MENU_ 条",
    "sInfo": "从 _START_ 到 _END_ 条,总共 _TOTAL_ 记录",
    "sInfoEmpty": "暂无记录",
    "sInfoFiltered": "(一共有 _MAX_ 条记录)",
    "oPaginate": {
    "sFirst": "首页",
    "sPrevious": " 上一页 ",
    "sNext": " 下一页 ",
    "sLast": " 末页 "
    }

    },
    //ajax 获得数据,我这次做的是ajax把所有数据都取过来,然后用他自己的js分页来完成分页功能,返回的数据应该是一个json格式的,并且把所有的数组 放到一个aaData的数组中
    "bProcessing": true,
    "sAjaxSource": "/index.php/ajax/get_user_list",//请求地址
    //这里就是自定义的每一列了,每一个{}都代表一列,如果不设定,可写成null
    "aoColumns": [
    {
    "mDataProp": "check",//json传回数据中的要展示的那一列的键值
    "bSearchable": false,//不参与搜索
    "sWidth":"5%",//自定义列宽
    "sClass":"center",//自定义样式
    },
    {
    "mDataProp": "pid",
    "sClass":"center",
    },
    {
    "mDataProp": "chname",
    "sClass":"center",
    },
    {
    "mDataProp": "username",
    "sClass":"center",
    },
    {
    "mDataProp": "district",
    "sClass":"center",
    },
    {
    "mDataProp": "leader_uid",
    "sClass":"center",
    },
    {
    "mDataProp": "rank",
    "sClass":"center",
    },
    {
    "mDataProp": "joindate",
    "sClass":"center",
    },
    ],

    "sPaginationType": "full_numbers" //翻页有两种样式,这种是数字型的,另外一种是默认的
    //滚动轴 自定义横向滚动轴,当表格超过这个宽度的时候,就会出现横向滚动轴,拖动整个表
    //"sScrollX": "100%",
    //"sScrollXInner": "100%",
    //"bScrollCollapse": true,


    //"iDisplayLength":10 //每页默认显示10条

    }

    );

    在附上一段json数据的格式

    {"aaData":[
    {"uid":"1","username":"111","chname":"\u7f57\u519b","pid":"F0001","district":"17","leader_uid":"0","kpi_type":"0","joindate":"2008-02-16 00:00:00","isresign":"0","dep_id":null,"rank":"7"},{"uid":"144","username":"222","chname":"\u674e\u5955\u8476","pid":"F0231","district":"17","leader_uid":"7","kpi_type":"0","joindate":"2008-05-07 00:00:00","isresign":"0","dep_id":null,"rank":"3"},



  • 相关阅读:
    Django+xadmin打造在线教育平台(八)
    Django+xadmin打造在线教育平台(七)
    Django+xadmin打造在线教育平台(六)
    Django+xadmin打造在线教育平台(五)
    Django+xadmin打造在线教育平台(四)
    Django+xadmin打造在线教育平台(三)
    Django+xadmin打造在线教育平台(二)
    Django+xadmin打造在线教育平台(一)
    Linux环境部署(一)
    centOS的联网问题
  • 原文地址:https://www.cnblogs.com/youxu/p/2276616.html
Copyright © 2020-2023  润新知