Order listener by href in table header

shavertech

First time caller, long time listener...

I'm trying to create a custom ordering method in my table's header, where there are two elements which each perform an ordering on columns. I'm using a headerCallback to generate the links, and I'm (trying to) attach order.listener() to each of the them so that "Account" orders on the user column, and "Domain" orders on the domain column. I also want to set the user column invisible, but I don't think that will matter here for order.listener function. Maybe I'm missing something easy, but I just don't see what I'm doing wrong.

Here's my test case, and hopefully someone will be able to see it better than me:
http://live.datatables.net/kewogida/1/edit

kthorngren

Thanks for the test case!

My suggestion is to set columns.orderable to false for the Account@Domain column instead of removing the click event handlers for all the columns.

Move the headerCallback code into initComplete and move the order.listener() into initCompete.

There are two issues with your code. First is headerCallback is called for each draw, overwriting the previous HTML and the event listeners. You are using ajax which is asynchronous so the order.listener() statements are executed before the before the Datatable init is complete.

See this example:
http://live.datatables.net/kewogida/2/edit

I added some debug statements so you can see the order of operations.

Kevin

shavertech

That's great, thank you! I think from here I would just add a CSS pseudo class to show ascending and descending carets for Account and Domain, but that shouldn't be too hard.