未捕获的TypeError:table.search(...).draw不是函数

Ton*_*one 13 javascript jquery datatables

添加了对jQuery DataTables插件的过滤,但效果不佳.

我希望有两个链接可以搜索特定搜索词的记录.为了弄清楚如何做到这一点,我首先尝试使用这个例子.它使用输入字段来搜索表中的值.它会生成此错误:

未捕获的TypeError:table.search(...).draw不是函数

我的代码:

$(document).ready(function() {
    $('#store-list').dataTable({
        "sPaginationType": "full_numbers"
    });

    var table = $('#store-list').DataTable();   

    $('#myFilter').on( 'keyup', function () {
    table
        .search( this.value )
        .draw();
    } );
});
Run Code Online (Sandbox Code Playgroud)

我尝试过不同的方法来完成这项工作:

  • .DataTable().dataTable().api()和交换.dataTable()

  • 试过( this.val() )( $('#myFilter').val() )(链接)

  • 试过table.search( this.value ).draw;(没有())

  • 在绝望中,我尝试了没有search,然后没有draw

有人可以帮我找到错误吗?

Gyr*_*com 21

原因

您正在使用DataTables插件1.9.4,但API方法和示例适用于较新的1.10.x版本.

当DataTables插件更新为1.10版本时,API方法已更改,有关详细信息,请参阅转换1.10的参数名称.

解决方案#1

将DataTables库升级到1.10版以使用search()API方法.

解决方案#2

如果由于某种原因无法升级到版本1.10,请使用以下代码.版本1.9有类似的示例,请参阅DataTables单个列过滤示例.

对于DataTables 1.9

$(document).ready(function(){

    $('#store-list').dataTable({
        "sPaginationType": "full_numbers"
    });

    $("#myFilter").on('keyup', function (){
        $('#store-list').dataTable().fnFilter(this.value);
    });
});
Run Code Online (Sandbox Code Playgroud)

有关fnFilter其他可选参数,请参阅API参考.


Lal*_*han 8

只需确保命名约定

\n\n

如果您使用远程数据表使用以下语法初始化数据表

\n\n
var table = $('#store-list').DataTable();\n
Run Code Online (Sandbox Code Playgroud)\n\n

代替

\n\n
var table = $('#store-list').dataTable();\n
Run Code Online (Sandbox Code Playgroud)\n\n

控制台变量table

\n\n
console.log(table)\n
Run Code Online (Sandbox Code Playgroud)\n\n

它将向您显示所有远程可访问的属性

\n\n

$: \xc6\x92 ()\najax: { dt_wrapper: true, json: \xc6\x92, 参数: \xc6\x92, 重新加载: \xc6\x92, url: \xc6\x92}\ncell: \xc6\ x92 ()\n单元格:\xc6\x92 ()\n清除:\xc6\x92 ()\n列:\xc6\x92 ()\n列:\xc6\x92 ()\n上下文:[{\xe2\x80\xa6 }]\n数据: \xc6\x92 ()\n销毁: \xc6\x92 ()\n绘制: \xc6\x92 ()\ni18n: \xc6\x92 ()\ninit: \xc6\x92 ()\n关闭: \xc6\x92 ()\非: \xc6\x92 ()\n无: \xc6\x92 ()\n顺序: \xc6\x92 ()\n页: \xc6\x92 ()\n行: \xc6\x92 ( )\n行: \xc6\x92 ()\n搜索: \xc6\x92 ()\n选择器: {行: null, 列: null, opts: null}\n设置: \xc6\x92 ()\n状态: \xc6\ x92 ()\n表: \xc6\x92 ()\n表: \xc6\x92 ()\n__proto : 对象(0)

\n\n
\n

dataTable如果您使用客户端数据表,将毫无问题地工作

\n
\n