JQuery的datatable里搜索功能怎么修改
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JQuery的datatable里搜索功能怎么修改相关的知识,希望对你有一定的参考价值。
JQuery的datatable里搜索功能修改:可以自己定义一个 input框 和按钮,点击按钮的时候,调用一个自己定义的函数,函数如下:
function search_fun()
var val = $('#search_val').val();//获取自己定义的input值 dataTable._fnFilter(val);//过 滤dataTable
参考技术A DataTables在默认情况下会显示一个search框(在右上角),一般我们不需要search框,可以通过将searching设为false把它隐藏掉。
Jquery Datatable 搜索框重新定位
【中文标题】Jquery Datatable 搜索框重新定位【英文标题】:Jquery Datatable search box reposition 【发布时间】:2015-05-21 03:43:55 【问题描述】:我想在 jquery 数据表之外重新定位过滤器框。我想要完全一样:
我该怎么做?
【问题讨论】:
【参考方案1】:只需使用detach().appendTo()
将#<table_id>_filter
div 重新定位到所需位置,如下所示:
$("#example").DataTable(
initComplete : function()
$("#example_filter").detach().appendTo('#new-search-area');
);
您甚至可以设置搜索过滤器框应如何出现在重新定位的位置:
#new-search-area
width: 100%;
clear: both;
padding-top: 20px;
padding-bottom: 20px;
#new-search-area input
width: 600px;
font-size: 20px;
padding: 5px;
演示 -> http://jsfiddle.net/dq2bmgd9/
【讨论】:
【参考方案2】:您可以使用 DataTables api 来过滤表格。因此,您所需要的只是您自己的输入字段,其中包含一个触发 DataTables 的过滤功能的 keyup 事件。使用 css 或 jquery,您可以隐藏/删除现有的搜索输入字段。或者也许 DataTables 有一个设置来删除/不包含它。
查看有关此的 Datatables API 文档。
例子:
HTML
<input type="text" id="myInputTextField">
JS
oTable = $('#myTable').dataTable();
$('#myInputTextField').keyup(function()
oTable.search($(this).val()).draw() ;
)
原文出处Datatables - Search Box outside datatable
【讨论】:
以上是关于JQuery的datatable里搜索功能怎么修改的主要内容,如果未能解决你的问题,请参考以下文章