So I have a datatable:
$(tables[i]).DataTable({
paging: false,
searching: false,
info: false,
ordering: true,
autoWidth: false,
columns: [ ... column stuff here ...
{name: "Name"},
{name: "Account"},
{name: "Number"}
]
});
later in code, I watch for a click event on a button so that I can grab some data from the table and then sort by a column
var columnName = $('.mySelectBox').val();
var columnNumber = 0;
if(columnName === "Account")
columnNumber = 1;
var table = $(tables[i]).DataTable();
I would like to now sort by either column 0 or column one on this button click. But not on any other column.
//this doesn't work for me
table.sort( [ [columnNumber, 'desc'] ] );
I use .order()
instead of .sort()
. Example:
$('#dataTables-example').DataTable().order([0, 'desc']).draw();
where 0
is the id of the column.
You can easily do that using order method of the table. Youcan adopt the following technique.
We need to do two things here.
Here let us assume we have a button or link to which click to bind.
$(".arrow-sort-ascending").bind("click", {
// Sorting should happen here
}
I use generic way to get column name. If you are using Jquery, we can fetch the column index using this.
myColumn = $(parent).prevAll().length
where parent should be the th of particular column.
// ascending
myTable.order([myColumn, "asc"]).draw()
So if we put the code in a single section, it looks like this.
table = myTable // This is datatable you initialized
$(".arrow-sort-ascending").bind("click", {table: table}, function(event){
parent = $(event.target).parent()
myIndex = $(parent).prevAll().length;
table.order([myIndex, "asc"]).draw()
}
So whenever we click the arrow-up icon, it sorts the clicked column.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.