zoukankan      html  css  js  c++  java
  • dataTables常用参数

    一、新版本和老版本的区别

    新版本的改进:https://datatables.net/new/1.10

    新老版本参数变化列表:http://datatables.club/upgrade/1.10-convert.html

    老版本参数列表:

      http://legacy.datatables.net/usage/features

      http://legacy.datatables.net/usage/options

      http://legacy.datatables.net/usage/columns

    新版本参数列表:

      http://datatables.club/reference/option/

    二、常用参数

    格式:新版本(老版本)

    1、autoWidth(bAutoWidth): 让Datatables自动计算宽度,默认值为true;

    2、serverSide(bServerSide) :开启服务器模式,默认值为false;

      不开启服务器模式,将数据一次取出来全部渲染;

      若开启服务器模式,只渲染当前页的数据;(大数据的时候建议开启该模式)

    3、ajax.data(fnServerParams) : 发送给服务器的参数

    4、ajax.dataSrc(sAjaxDataProp):表数据的数据属性或操作方法

    (1)当为表数据的数据属性时,如下:

    $('#example').dataTable( {
      "ajax": {
        "url": "data.json",
        "dataSrc": "tableData"
      }
    } );

    (2)当为方法时,相当于JQuery的ajax的success方法

    $('#example').dataTable( {
      "ajax": {
        "url": "data.json",
        "dataSrc": function ( json ) {
          for ( var i=0, ien=json.data.length ; i<ien ; i++ ) {
            json.data[i][0] = '<a href="/message/'+json.data[i][0]+'>View message</a>';
          }
          return json.data;
        }
      }
    } );

    5、ajax(fnServerData):从 Ajax 源加载数据的表的内容,ajax 作为function用法

    6、data(aaData):给表格显示的数据

    7、destroy(bDestroy):允许重新实例化Datatables,销毁表格实例,默认值为false;  常和 retrieve 参数使用;

    Destroy an exisiting table and create a new one:

    $('#example').dataTable( {
      "srollY": "200px"
    } );
     
    // Some time later, recreate with just filtering (no scrolling)
    $('#example').dataTable( {
      "filter": false,
      "destroy": true
    } );

    8、retrieve(bRetrieve):检索一个已存在的Datatables实例; 常和 destroy 参数使用;

    Retrieve DataTable instance for an exisiting table:

    $(document).ready( function() {
      initTable();
      tableActions();
    } );
     
    function initTable () {
      return $('#example').dataTable( {
        "scrollY": "200px",
        "paginate": false,
        "retrieve": true
      } );
    }
     
    function tableActions () {
      var table = initTable();
     
      // perform API operations with `table`
      // ...
    }
  • 相关阅读:
    iTerm2使用技巧
    我的mac下有关php扩展的安装
    xmlhttprequest 1.0和2.0的区别,from qq前端哥
    PHP错误日志记录:display_errors与log_errors的区别
    目前php连接mysql的主要方式
    闭包介绍汇总
    接口设计知识总结
    git命令——从GitHub clone XXX分支,本地创建新分支push到远程仓库
    Spring错误——Junit测试——java.net.BindException: Address already in use: bind
    Java.util.Random生成随机数
  • 原文地址:https://www.cnblogs.com/yufeng218/p/6622600.html
Copyright © 2011-2022 走看看