Datatable headers missing after clicking filter button
Datatable headers missing after clicking filter button
wns
Posts: 12Questions: 8Answers: 0
I made a datatable using yagra. However, every time I click the filter button, the header is now showing so I need to refresh the page back. Im not sure if its related to the filter button() or anything else.
I managed to filter it. However, when I clicked filter, my datatable headers are missing but I couldnt figure out what the problem is. My blade is:
<table id="table_data" class=" table-responsive table-striped table-hover table-bordered ">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">First Name</th>
<th scope="col">Last Name</th>
</tr>
</thead>
</table>
Filter function:
$('#filter').click(function(){
var table = $('#table_data').DataTable();
var name= $('#name').val();
var age= $('#age').val();
var gender= $('#gender').val();
if( $.fn.DataTable.isDataTable('#table_data')){
table.destroy();
$('#table_data').empty();
var dataTable = $('#table_data').DataTable({
processing: false,
serverSide: false,
ajax:{
url:'/filter-result',
data:{name:name, age:age,gender:gender}
},
columns: [
{
data:'id',
name:'id'
},
{
data:'First_name',
name:'First_name'
},
{
data:'Last_name',
name:'Last_name'
}
]
});
}
});
What is the reasons the header missing after clicked?
This discussion has been closed.
Answers
Please don't duplicate threads. You asked the same question here. Colin asked for a link to your page or a test case we can look at. The code above isn't enough for us to help you debug the problem. We actually need to see the problem happen.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin