What I am trying to achieve
Disable my filtering function for column 8 in my table. (e.g it won't get recognized/does not care)
What I am struggling with
I can't manage to exclude column number 8 from my filtering. I've tried to use .not
but cannot get that to work either. I've also attempted to use the CSS :not
but I've heard that is not reliable enough (even though I am using it in my code). I struggle to implement this the right way.
My question
What would be the best option for this kind of task? How would I implement this correctly?
What my filtering looks like
$("#table_search").on("keyup", function() {
var value = $(this).val().toLowerCase();
$(".table_data tr:not(:has(th))").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
DOM
<div class="table_responsive">
<div><input type="input" id="table_search" class="form-control" placeholder="Perform a search..."></div>
<table>
<thead>
<th>thead1</th>
<th>thead2</th>
<th>thead3</th>
<th>thead4</th>
<th>thead5</th>
<th>thead6</th>
<th>thead7</th>
<th>thead8</th>
</thead>
</table>
<div class="table_scroll">
<table class="table_data">
<tr>
<td>row1</td>
<td>row2</td>
<td>row3</td>
<td>row4</td>
<td>row5</td>
<td>row6</td>
<td>row7</td>
<td>row8</td>
</tr>
</table>
</div>
</div>
Additional comments
I am aware there are questions almost identical to mine and I don't know if it's because I haven't finished my morning coffee or what not. But it's a shame (and a bit embarassing) I struggle with tweaking and implementing their solution to my problem.
Here's a few similar questions I've taken a look at: