Add sorting arrow on the all nested data tables with Jquery

would like to add sorting arrow on the table headers. We have got 3 nested data table.

var getTableHeader = $(".dataTable th");
[url="https://jsfiddle.net/yakupme/vfgjy726/"]Jsfiddle code[/url]
getTableHeader.append('');

getTableHeader.click(function(e){
e.preventDefault();
console.log("table header is clicked");
$(this).find('span').toggleClass('ascArr descArr');

Open in new window


https://jsfiddle.net/yakupme/vfgjy726/

It does not add on the 2 and 3.level datatable header.  Can anyone help me on this issue please ?
Yakup KAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Julian HansenCommented:
According to the Docs for Nested tables you need to set the bsort setting to true

var settings = {
  "iDisplayLength": 20,
  "bLengthChange": false,
  "bFilter": false,
  "bSort": true,  // <<===== MUST BE TRUE
  "bInfo": false
};

Open in new window

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
lenamtlCommented:
Hi,

Like Julian said with
"bSort": true, 

Open in new window

this add the feature for all.
And if you want to disable it on some column you can use bSortable (i usually remove it from tool column, when there are only checkbox or in your case the arrow to open the child section)

$(document).ready( function() {
  $('#example').dataTable( {
   // for all
   "bSort": true,
   // not on the first column You can change 0 to any other column number
    "aoColumnDefs": [
      { "bSortable": false, "aTargets": [ 0 ] }
    ] } );
} );

Open in new window


for more info
https://legacy.datatables.net/ref#bSort
table sortings
https://legacy.datatables.net/release-datatables/examples/basic_init/table_sorting.html
multi sorting
https://legacy.datatables.net/release-datatables/examples/basic_init/multi_col_sort.html

To sort some data type like date or digits you will need to use a sort plugins
https://datatables.net/plug-ins/sorting/

Also you will need some code adjustment if your data have HTML code.
Yakup KAuthor Commented:
Thanks very much for your answer. That's fixed now.
Julian HansenCommented:
You are welcome.
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
DOM

From novice to tech pro — start learning today.