How to Sort Data tables and draw

jordan_josh3184

Link to test case:
initComplete: function() { const table = this.api(); [1,2].forEach(column => table.column(column).header().innerHTML += '</br><span name="act" class="act">Act# &nbsp;&nbsp;</span> </br> <span name="ic" class="ic">IC/Serial</span>'); } $('span.act').on('click', function(event) { $('#example').DataTable().order( [[ 1, 'asc' ], [ 2, 'asc' ]] ).draw(); });:

Description of problem: Hello ,
I am running into Issue for Sorting where I am trying to sort data based on Click event of data table header. I am capturing click event with this code. As you can see I can sort it with Order clause but it requires to give asc or desc so when user clicks on header second time it wont sort desc as it is already sorted for asc. how can i change asc or desc dynamically or what else can I use and draw the table.
thank you

kthorngren

Why don't you let the default Datatables click events sort the table?

If you want to control this your self you can use order() to get the current order and use that determine whether to use asc or desc.

Kevi

jordan_josh3184

Hi Kevi ,
How Can i get the current order with order() api. I can see the options to pass 1-D or 2-D array something like this which I tried.
table.order( [[ 1, 'asc' ], [ 2, 'asc' ]] ).draw(); but it created problem when user clicks on it second time as asc is fixed and it doesnt sort for desc .. how Can i pass asc or desc dynamically in this.
Jordan

colin

How Can i get the current order with order() api.

order() returns the current order is called with no parameters.

For the second part, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

jordan_josh3184

Hi Colin,
I have provided link for data tables code here. I tried to disable sorting icon with code which is pasted in <style> tag for html which doesnt disable the default sort icon . its requirement . once we disable the sort icon and try to click on home or cell . it should sort based on the sort order.
live.datatables.net/xizubuke/7/edit

kthorngren

Here is an updated example:
http://live.datatables.net/rativozu/1/edit

Look for the comments. I only made changes for the Home button. I turned off ordering for the column with Home and Cell click events.

Using order([1,'asc'],[2,'asc']) won't work. It needs to be an array containing one or more column arrays, like this order( [ [1,'asc'],[2,'asc'] ] ). Also you need to chain the draw() API to order the table.

Hope the rest makes sense. If not please ask.

Kevin

jordan_josh3184

Thank you all for your support. Issue is resolved now.