初始化

此扩展现在已停用,并已由 按钮选择 扩展取代。文档仅保留供旧版参考。新项目应优先使用 按钮选择,而不是表格工具。

表格工具的初始化通常与 DataTables 的初始化同时进行,通过 domtableTools 属性。表格工具的自定义是通过 tableTools 对象的属性完成的 - 完整的可用选项列表在前面提供。也可以直接初始化表格工具,这在您想要轻松引用实例或将工具栏放置在 DataTables DOM 结构之外时很有用。

DataTables 属性

tableTools
显示详情
要通过 DataTables 初始化对象自定义表格工具选项,您可以使用此参数。下面“初始化参数”部分中给出的任何选项都可以在此处使用。
默认 {}
类型 对象
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "sSwfPath": "/swf/copy_csv_xls_pdf.swf" } } ); } );
dom
显示详情
DataTables 中的 dom 参数用于在 DOM 中定位 DataTables 添加到表格的各种控件(过滤、分页等)。这将直接影响元素在显示中的位置,当与您的 CSS 结合使用时。表格工具可以通过在 dom 中插入字符 'T' 来包含。这对于初始化表格工具来说已经足够了 - 一切都是选项和自定义。
默认 lfrtip
类型 字符串
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip' } ); } );

选项

aButtons
显示详情
此参数定义了表格工具将使用的按钮,并提供了表格工具自定义的主要焦点。在它的基本形式中,此数组的元素是与预定义按钮匹配的字符串,但元素也可以是定义您自己的按钮或覆盖默认操作的对象。这在 按钮 页面上得到充分解释。
默认 [ "copy", "csv", "xls", "pdf", "print" ]
类型 数组
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "aButtons": [ "copy", "print" ] } } ); } );
fnPreRowSelect
显示详情
这是一个回调函数,在选择行之前触发(即鼠标按下已发生,但表格工具尚未选择行)。如果需要,它可以用来取消选择。
默认
输入参数
  1. event : 发生的点击事件以选择此行
  2. array - node : 要选择的 TR 元素
返回参数 Boolean - 如果可以选择行,则为 true,否则为 false。
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "fnPreRowSelect": function ( e, nodes ) { if ( e.currentTarget.className.indexOf('no_select') != -1 ) { return false; } return true; } } } ); } );
fnRowDeselected
显示详情
当取消选择行时调用的回调函数(即与 fnRowSelected 相反)。
默认
输入参数
  1. array - node : 取消选择的 TR 元素
返回参数 void
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "fnRowDeselected": function ( nodes ) { alert( 'The row with ID '+nodes[0].id+' was deselected' ); } } } ); } );
fnRowSelected
显示详情
选择行时发生的回调函数。这允许在选择任何行时执行特定操作(例如,所选行的计数器)。
默认
输入参数
  1. array - node : 已选择的 TR 元素
返回参数 void
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "fnRowSelected": function ( nodes ) { alert( 'The row with ID '+nodes[0].id+' was selected' ); } } } ); } );
sRowSelect
显示详情
表格工具提供了所有需要允许最终用户在表格中选择行(通过单击它们)的功能。默认情况下禁用此功能,但可以通过将此属性设置为“single”(仅允许一次选择表格中的一行)或“multi”(允许选择任意数量的行)来轻松启用它。
默认 none
类型 字符串
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "sRowSelect": "single" } } ); } );
sRowSelector
显示详情
默认情况下,当行选择处于活动状态时,表格工具将在单击表格中的任何元素时选择一行。将此选择限制在某些列,甚至行中的某些元素可能很有用,这可以通过此选项完成。这是一个简单的 jQuery 选择器字符串,用于选择将执行选择的元素。
默认 tr
类型 字符串
代码示例 $(document).ready( function () { // Click on the row or all but the first column to select the row $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "sRowSelector": "td:not(:first-child)" } } ); } );
sSelectedClass
显示详情
设置用于指示最终用户已选择行的类。
默认 DTTT_selected
类型 字符串
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "sRowSelect": "multi", "sSelectedClass": "row_selected" } } ); } );
sSwfPath
显示详情
定义表格工具用于复制到剪贴板和将文件本地保存操作的 SWF 路径。如果您在进行这些操作时遇到问题,但没有打印,则很可能是这个问题。
默认 media/swf/copy_csv_xls_pdf.swf
类型 字符串
代码示例 $(document).ready( function () { $('#example').dataTable( { "dom": 'T<"clear">lfrtip', "tableTools": { "sSwfPath": "/swf/copy_csv_xls_pdf.swf" } } ); } );

直接初始化

表格工具可以通过 $.fn.dataTable.TableTools 类直接初始化,也可以通过 DataTables dom 选项初始化。表格工具构造函数必须使用关键字 new 调用以创建新实例,并且接受两个参数

1 .DataTables 对象 - 要将表格工具附加到的 DataTables 实例(即它将获取数据源的地方)。2. 表格工具初始化选项 - 包含上面列表中选项的对象。

下面的示例展示了如何以这种方式初始化表格工具。请注意,您需要使用 fnContainer() API 方法手动将表格工具创建的容器元素插入 DOM,并将返回的节点注入到您希望它在文档中显示的位置。下面的示例展示了将其插入到 #demo 元素之前。

$(document).ready( function () {
    var table = $('#example').dataTable();
    var tableTools = new $.fn.dataTable.TableTools( table, {
        "buttons": [
            "copy",
            "csv",
            "xls",
            "pdf",
            { "type": "print", "buttonText": "Print me!" }
        ]
    } );
     
    $( tableTools.fnContainer() ).insertAfter('div.info');
} );