I am using jQuery DataTables Individual Column Searching, on one of my tables and one of my columns contains checkboxes.
HTML
<table id="NewTable" class="table table-bordered table-striped">
<thead>
<tr>
<th class="col-sm-1 text-center ">
@Html.DisplayNameFor(model => model.c_AMake.AMake)
</th>
<th class="text-center col-sm-1">
@Html.DisplayNameFor(model => model.Model)
</th>
<th>
@Html.DisplayNameFor(model => model.Test)
</th>
</tr>
</thead>
<tfoot id="NewTable-Foot" style="display: table-header-group">
<tr>
<th class="col-sm-1 text-center ">
@Html.DisplayNameFor(model => model.c_AMake.AMake)
</th>
<th class="text-center col-sm-1">
@Html.DisplayNameFor(model => model.Model)
</th>
<th>
@Html.DisplayNameFor(model => model.Test)
</th>
</tr>
</tfoot>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.c_AMake.AMake)
</td>
<td>
@Html.DisplayFor(modelItem => item.Model)
</td>
<td>
@Html.DisplayFor(modelItem => item.Test)
</td>
</tr>
}
</table>
jQuery
var newTable = $('#NewTable tfoot th').length;
// Setup - add a text input to each footer cell
$("#NewTable tfoot th").each(function (index) {
if (index !== newTable - 1) {
var title = $(this).text().trim();
$(this).html('<input type="text" class="form-control" placeholder="' + title + '"/>');
}
});
var newDTTable = $('#NewTable').DataTable();
newDTTable.columns().every(function () {
var that = this;
console.log(this.data());
$('input', this.footer()).on('keyup change',
function () {
if (that.search() !== this.value) {
that
.search(this.value)
.draw();
}
});
});
This displays the column I am speaking of like so:
But if I start typing "True" into the textbox.. my table refreshes to say "No matching records found". Fair enough, because the checkbox doesn't have a value of "true" in terms of HTML rendering.. instead it just says `checked="checked".
But as an argument, when I do console.log(this.data())
, I see every row in the table and those values are coming back as "True", "False", "False".
Is there a way to search for checkboxes that are either checked or unchecked via jQuery datatables?
Aucun commentaire:
Enregistrer un commentaire