Question

为jQuery DataTables插件添加了过滤功能，但效果不佳。

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

未捕获的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();
    } );
});

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

使用.DataTable()和.dataTable().api()

.dataTable()

尝试( this.val() )和( $('#myFilter').val() )（link）
尝试table.search( this.value ).draw;（不含()）
在绝望中我尝试了search，然后没有draw

有人可以帮我找错吗？

Answer 1

原因

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

当DataTables插件更新为1.10版本时，API方法已更改，有关详细信息，请参阅Converting parameter names for 1.10。

解决方案＃1

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

解决方案＃2

如果由于某种原因无法升级到1.10版，请使用以下代码。版本1.9有类似示例，请参阅DataTables individual column filtering example。

对于DataTables 1.9

$(document).ready(function(){

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

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

有关其他可选参数，请参阅fnFilter API参考。

Answer 2

这项工作对我来说：

var table = $('#campaniasVinculadas').DataTable();

$('#myFilters input').on( 'keyup', function () {
    table
        .search( this.value )
        .draw();
});

我使用了选择器'#myFilters input'，因为Tfoot的ID "#myFilters"没有＆＃34;值＆＃34;属性，但＆＃34;输入＆＃34;具有value属性。

Answer 3

只需确保使用命名约定

如果您正在使用远程datable，请使用以下语法初始化数据表

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

代替

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

控制台变量table

console.log(table)

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

$：ƒ（） ajax：{ dt_wrapper：true，json：ƒ，params：ƒ，重新加载：ƒ，url：ƒ} 储存格：ƒ（）储存格：ƒ（）清除：ƒ（）列：ƒ（）列：ƒ（）上下文：[{…}] 数据：ƒ（）销毁：ƒ（）画：ƒ（） i18n：ƒ（）初始化：ƒ（）关：ƒ（）开：ƒ（）一：ƒ（）顺序：ƒ（）网页：ƒ（）行：ƒ（）行：ƒ（）搜索：ƒ（）选择器：{行：null，列：null，选择：null} 设置：ƒ（）状态：ƒ（）表格：ƒ（）表：ƒ（） __proto ：对象（0）

如果您使用客户端数据表，
dataTable可以解决任何问题

未捕获的TypeError：table.search（...）。draw不是函数

3 个答案:

原因

解决方案＃1

解决方案＃2