Hi I have the following table design. I dont want the first and last column to be sortable. I have set accordingly.But the icon asc still appears on the first column but not on the last column. But when I try to sort the second column it goes off.
<table id="userTable" name='userTable' class="table table-striped table-bordered bootstrap-datatable " data-column-defs='[{"sortable": false, "targets": [0,3]}]' style='table-layout: fixed;'>
<thead>
<tr>
<th class="no-sort" style='width: 10%;'>No.</th>
<th style='width: 25%;'>First Name</th>
<th style='width: 20%;'>last Name</th>
<th style='width: 25%;'>Details</th>
</tr>
</thead>
</table>
By setting allowSorting property as false in the column settings, we can prevent the sorting action on that particular column.
Use columnDefs option to remove sorting from a column. Pass column index in targets within [] (Indexing starting from 0) and set orderable to false .
Using the order initialisation parameter, you can set the table to display the data in exactly the order that you want. The order parameter is an array of arrays where the first value of the inner array is the column to order on, and the second is 'asc' (ascending ordering) or 'desc' (descending ordering) as required.
aoColumnDefs: This array allows you to target a specific column, multiple columns, or all columns, using the aTargets property of each object in the array (please note that aoColumnDefs was introduced in DataTables 1.7).
Even if you disable sorting for a column, the dataTables sort order
still remain. By default order
is [0, 'asc']
; simply set order
to target the #2 column instead :
var table = $('#example').DataTable({
//....
order: [[ 1, "asc" ]] //column indexes is zero based
})
demo -> http://jsfiddle.net/6k26o7mk/
Or use order: []
if you not want any default order at all (icons will be hidden until the user sort the table).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With