Multi-column search is causing re-sizing to not be responsive
Multi-column search is causing re-sizing to not be responsive

When using the multi-search columns, re-sizing is not responsive...checked it with the debugger and found no errors.
The last column in the table is a button. If i remove the <th></th> tag from <tfoot> for the button column, then resizing works but searching is on-op.
What could be going on here?
Also, can a specific column be excluded from the multi-column search as there is no need to search a column up download buttons?
the javascript is...
<script type="text/javascript">
$(document).ready(function () {
// Setup - add a text input to each cell for search
$('#ListOfStudents tfoot th').each(function () {
var title = $(this).text();
$(this).html('<input type="text" placeholder="Search ' + title + '" />');
});
// DataTable
var table = $('#ListOfStudents').DataTable({
"iDisplayLength": 10
, "searching": true
, responsive : true
});
// Apply the search
table.columns().every(function () {
var that = this;
$('input', this.footer()).on('keyup change', function () {
if (that.search() !== this.value) {
that
.search(this.value)
.draw();
}
});
});
var n = document.createElement('script');
n.setAttribute('language', 'JavaScript');
n.setAttribute('src', 'https://debug.datatables.net/debug.js');
document.body.appendChild(n);
});
</script>
Using the following css to put the search boxes on top of the column headers...
tfoot {
display: table-header-group;
}
tfoot input {
width: 100%;
padding: 3px;
box-sizing: border-box;
}
classes used for the table...
<table id="ListOfStudents" class="table table-bordered table-condensed table-hover table-responsive">
Answers
hi @cgolby ,
We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.
Cheers,
Colin
ok, thank you!