Individual column searching
Individual column searching
I followed this tutorial
https://datatables.net/examples/api/multi_filter.html
I get this error:
Uncaught TypeError: otable.columns(...).every is not a function
at HTMLDocument.<anonymous> (Index:166)
at mightThrow (jquery-3.3.1.js:3534)
at process (jquery-3.3.1.js:3602)
This is my code:
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
<!-- jQuery -->
<script type="text/javascript" charset="utf8" src="https://code.jquery.com/jquery-3.3.1.js"></script>
<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.5/js/jquery.dataTables.js">
</script>
@section scripts{
<script>
$(document).ready(function () {
// Setup - add a text input to each footer cell
$('#item tfoot th').each(function () {
$(this).html('<input type="text" style="color: black" placeholder="(All)" />');
});
// DataTable
var otable = $('#item').DataTable({
"paging": false,
"searching": false,
"bInfo": false,
"bLengthChange": false,
"pageLength": 200
});
// Apply the search
otable.columns().every(function () {
var that = this;
$('input', this.footer()).on('keyup change', function () {
if (that.search() !== this.value) {
that
.search(this.value)
.draw();
}
});
});
});
</script>
}
This question has accepted answers - jump to:
This discussion has been closed.
Answers
Looks like your code should work. Is that the complete Datatables init code, ie, do you have
ajax? If you have theajaxoption then you will need to move the line 22-33 intoinitCompleteand instead ofotable.columns().every(function () {usethis.api().columns().every(function () {like this example.If this doesn't help then please post a link to your page or a test case replicating the problem so we can help.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
@kthorngren I am not sure I follow but I tried what you said, same issue. Here is my sample.
http://live.datatables.net/tuxowiku/1/edit
You are using an old version of datatables.js (1.10.5). According to the
columns().every()docs this API was introduced in 1.10.6:But you are loading the 1.10.20 version of datatables.css. Try the latest version.
Kevin
@kthorngren
I am using this now:
The error is gone But the issue is still there. The search doesn't work. what is the latest version of css
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css">
Do you have an updated test case?
The latest Datatables version is 1.10.20. The style sheet version should match the Datatables version you are using.
Kevin
@kthorngren http://live.datatables.net/tuxowiku/5/edit
You have
"searching": false,which will turn off searching. To leave searching on and remove the search input you need to use thedomoption.Kevin
Thank you. I didn't know that. here is the final code: http://live.datatables.net/tuxowiku/5/edit