Sorting does not work when using scollY
Sorting does not work when using scollY
kaustubhzoal
Posts: 2Questions: 1Answers: 0
I have a table that has data loaded dynamically. It has some dropdowns and text fields in it as well. The first two columns are set to be orderable. For ex:
{ "width": "8%", "targets": 0, orderable : true },
{ "width": "12%", "targets": 1, orderable : true }
The column header shows the up/down arrow correctly but when I click on either of these column headers the sort does not work. I noticed that the sort will work if I comment the scrollY setting on the datatable.
Here is how I initialize the table
$('#tblItems').DataTable({
"destroy": true,
"jQueryUI": true,
"iDeferLoading": 0,
"pagingType": "simple_numbers",
"pageLength": -1,
"autoWidth": false,
"paging": false,
"info": false,
"searching": false,
scrollCollapse: true,
scrollY: '350px',
"columns": [
{ "width": "8%", "targets": 0, orderable : true },
{ "width": "12%", "targets": 1, orderable : true },
{ "width": "10%", "targets": 2, orderable : false },
{ "width": "10%", "targets": 3, orderable : false },
{ "width": "5%", "targets": 4, orderable : false },
{ "width": "10%", "targets": 5, orderable : false },
]
}).draw();
I am not sure if anyone has faced this kind of problem with the sort not working when using scrollY option.
Please let me know if there is a fix/solutions for this.
Thanks.
Answers
Are you saying that you have a single header that has both the sorting events and search inputs in the same header?
Likely you have some conflict with the sorting and the search input event handlers. The recommended solution is to have two headers; one with for sorting and one for the search inputs. See this simple example:
https://live.datatables.net/mofecazu/1/edit
If you want one header or are still having issues then please post a link to a test case showing the issue so we can see exactly what you have and to help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case
Kevin
I will check it out and let you know. Thanks.