Question

所以标题说我正在尝试为DataTables JQuery插件创建自己的搜索框，因为默认位置不适用于我，也没有DOM配置，因为我试图让它进入用于显示目的的一行表。

我有这个html位：

<th>Search by plan name and number :<br><input type="text" id="searchbox"></th>

对于初始化DataTables的脚本我已经

了

<script>
$(document).ready(function() {
    var dataTable = $('#table_id').DataTable( {
        "dom": '<"top"f>rt<"bottom"lp>' //adjust the locations of defaults
    });

    // Custom search box
    $("#searchbox").keyup(function() {
    dataTable.fnFilter(this.value);
    }); 
});
</script>

最后在CSS中我添加了这一位，删除了默认搜索框：

.dataTables_filter {
   display: none;
}

然而每当我输入我的自定义框时，都没有任何反应。有关编辑此内容的任何建议或操作方法吗？

PS：我还试图调整页面选择器的位置和“显示#out of＃”信息位，所以如果有人知道如何移动那些/在其他地方重新创建（可能与搜索栏的方式相同）那么请随意分享。谢谢！

Answer 1

我发现了一些修复它的代码！结果我的原始脚本不正确，这应该是这样的：

<script>
        $(document).ready(function() {
            var dataTable = $('#table_id').DataTable( {
                "dom": '<"top"f>rt<"bottom"lp>' //adjust the locations of defaults
            });

            // Custom search bar - **THIS IS WHAT CHANGED**
            $('#searchbox').keyup(function(){
                dataTable.search($(this).val()).draw() ;
            }) 
        });
</script>

为DataTables JQuery插件创建自定义搜索框

1 个答案: