Search not working
Search not working
Hi Guys,
I'm using this API https://datatables.net/examples/api/row_details.html, and after I implemented this table to my asp.net mvc application I'm getting the data through json and all looks fine.
The issue I have is the search textbox is not functioning also sorting pages...actually nothing works just the data show and the collaps button.
here is my code example for your review:
@{
ViewBag.Title = "Datatable";
}
<style>
td.details-control {
background: url('../resources/details_open.png') no-repeat center center;
cursor: pointer;
}
tr.details td.details-control {
background: url('../resources/details_close.png') no-repeat center center;
}
</style>
<br />
<br />
<br />
<br />
<br />
<br />
<link href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css" rel="stylesheet" />
Itemlookup | Description | |
---|---|---|
Itemlookup | Description |
@section scripts{
<script type="text/javascript">
function format(d) {
return 'Cost: ' + d.Cost
+ '<br>' +
'Price: ' + d.Price + '<br>' + '';
}
$(document).ready(function () {
var dt = $('#example').DataTable({
"processing": true,
"serverSide": true,
"ajax": "/Home/Returnjson",
"columns": [
{
"class": "details-control",
"orderable": false,
"data": null,
"defaultContent": ""
},
{ "data": "Itemlookupcod" },
{ "data": "Description" }
],
"order": [[1, 'asc']]
});
// Array to track the ids of the details displayed rows
var detailRows = [];
$('#example tbody').on('click', 'tr td.details-control', function () {
var tr = $(this).closest('tr');
var row = dt.row(tr);
var idx = $.inArray(tr.attr('id'), detailRows);
if (row.child.isShown()) {
tr.removeClass('details');
row.child.hide();
// Remove from the 'open' array
detailRows.splice(idx, 1);
}
else {
tr.addClass('details');
row.child(format(row.data())).show();
// Add to the 'open' array
if (idx === -1) {
detailRows.push(tr.attr('id'));
}
}
});
// On each draw, loop over the `detailRows` array and show any child rows
dt.on('draw', function () {
$.each(detailRows, function (i, id) {
$('#' + id + ' td.details-control').trigger('click');
});
});
});
</script>
}
Answers
From the server-side processing docs:
In other words, with your "serverSide: true" initialisation, DataTables expects your own server-side script to handle sorting, searching, etc.