jquery之自动完成数据表 jquery 搜索

我想实现自动完成 http://jqueryui.com/autocomplete/对每一列进行过滤

在数据表 jquery 插件中。

例如，如果我想在数据表搜索中搜索带有 ED 的嵌入式设备，它不会为我做...所以我想显示自动完成，当用户从列表中选择它时我想要 要过滤的数据表。

var oTable = $('#listings_row').dataTable( ); 
$("thead input").keyup( function ( 
                oTable.fnFilter( this.value, parseInt($(this).attr('id')) ); 
            } ); 
 
 
            $("thead input").each( function (i) { 
                asInitVals[i] = this.value; 
            } ); 
 
            $("thead input").focus( function () { 
                if ( this.className == "search_init" ) 
                { 
                    this.className = ""; 
                    this.value = ""; 
                } 
            } ); 
 
            $("thead input").blur( function (i) { 
                if ( this.value == "" ) 
                { 
                    this.className = "search_init"; 
                    this.value = asInitVals[$("#listings_row thead input").index(this)]; 
                } 
            } ); 

我该怎么做？

请您参考如下方法:

您可以使用我的插件，看一下示例:4'th column

这是我的插件的 github 链接:

Yet Another DataTables Column Filter - (yadcf)

这是一个代码片段，只需在相关列中设置enable_auto_complete: true(在下面的代码column_number : 3中):

$(document).ready(function(){ 
  $('#example').dataTable().yadcf([ 
    {column_number : 0}, 
    {column_number : 1, filter_container_id: "external_filter_container"}, 
    {column_number : 2, data:["Yes","No"], filter_default_label: "Select Yes/No"}, 
    {column_number : 3, text_data_delimiter: ",", enable_auto_complete: true}, 
    {column_number : 4, column_data_type: "html", html_data_type: "text", filter_default_label: "Select tag"}]); 
});