所以正如标题所说,我正在尝试为 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;
}
然而,每当我在我的自定义框中输入时,什么都没有发生。有任何关于编辑此内容的建议或操作方法吗?
P.S:我也在尝试调整页面选择器的位置和“显示#out of#”信息位,所以如果有人知道如何移动这些/在其他地方重新创建(可能与搜索栏的方式相同)那么请随时分享。谢谢!
最佳答案
我找到了一些修复它的代码!原来我的原始脚本不正确,应该是这样的:
<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>
关于javascript - 为 DataTables JQuery 插件创建自定义搜索框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38114885/