How to search everything except column 1 in a datatable?
How to search everything except column 1 in a datatable?
Aashika Vasra
Posts: 2Questions: 1Answers: 0
I have a set of checkboxes, which when checked, its value will get copied to DT search box and will filter the DT. When I check my checkbox, I want the search box to search every part of my DT except my first column of DT. Is that possible to do something like that?
My code:
<html>
<head> <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>
<script type="text/javascript">
$(document).ready( function () {
$('#table_name').DataTable();
} );
</script>
</head>
<body>
<table id="table_name">
<thead>
<tr>
<th >Link</th>
<th>Category</th>
<th>Cat2</th>
</tr>
</thead>
<tbody>
<tr>
<td>FAQs About Resources</td>
<td>Cougar Courses Basics</td>
<td>1</td>
</tr>
<tr>
<td>Add Files to Your Course</td>
<td>Adding Resources</td>
<td>2</td>
</tr>
</table>
</body>
</html>
My JS Code:
$(document).ready(function(){
var table = $('#table_name').DataTable();
$("input").change(function(){
table.columns( ':gt(1)' ).eq( 0 ).each( function ( colIdx ) {
var selected = [];
$.each($("input[type='checkbox']:checked"), function(){
selected.push($(this).val());
});
// alert(selected.join("|"));
$('#table_name').DataTable().search(selected.join(" ")).draw();
} );
});
});
Another code tried:
$(document.ready(function(){
$('#table_name').DataTable();
//Fetch check box values and copy it to the search box of DT
$("input").change(function(){
var selected = [];
$.each($("input[type='checkbox']:checked"), function(){
selected.push($(this).val());
});
// alert(selected.join("|"));
$('#table_name').DataTable().search(selected.join(" ")).draw();
$('#table_name').DataTable( {
'columnDefs': [{
'targets': [1],
'searchable': false}]
});
});
});
This discussion has been closed.
Answers
Hi @Aashika Vasra ,
You need to use
columns.searchable, as yo are in line 17 in your last code snippet. You're also initialising the table first without this, line 2, so it won't take effect. Just replace the initialisation on line 2 with the one on line 14.Cheers,
Colin
Hello @colin ,
Thank you for your time.
But my requirement is: When DT is loaded on page, the full table must be searchable.
But, when I use the checkbox, I want the value to be pasted in the search bar of DT and enable search on all columns except the first column.
That is the reason why, I have enabled the full data table in line 2 and re-initialised it again on in line 14 which is inside an on change event of my check box.
Is there any way to achieve my requirement?
Best,
Aashika.
You could add
destroyto the second initialisation - I suspect it's currently failing without this. The downside is you'll need to do the opposite when the search is cleared, which sounds like it's getting messy to me.I would consider using a search plugin and not use
search().search()is going to search all columns. Usingcolumns().search()probably won't do what you want because its anandbased search. In order to populate the global search input with the checkbox search you will probably also need to not use the default and create your own input.Here is a checkbox example that may help you get started. Its not exactly what you are asking for but does show how to use checkboxes and the search plugin. Notice the use of
draw()to force the search plugin to run instead ofsearch(). You don't want the plugin competing with thesearch()mechanism.http://live.datatables.net/wenaxuti/1/edit
You can use the
domoption to remove the default search input. Then create your own and populate with the checkbox search term or if the checkbox is unchecked then perform a normal search usingsearch().Kevin