Buttons Column Visibility Default Column Text - issue with commented tags

adam@cuskit.co.uk

I use Font Awesome 5's svg icons throughout my sites and add the FA sort icons to my column headers and hide the default ones so that the icons are consistent with the rest of the site.

If you aren't aware FA5 comments out the <i> tag and adds in an <svg> to actually display the icon.

This all works fine until using the Column Visibility button.
This attempts to strip any html from the header and removes the start tag (<!--) and the comment itself but it seems to always leave the closing comment tag (-->.
For example, <th>Order No. <svg></svg><!-- <i class='fa fa-sort'></i> --></th> gives the Column Text Order No. -->

I've managed to work around it in my project using:
'columnText': function ( dt, idx, title ) { return dt.column(idx).header().innerText; }

However, I thought I'd raise the issue as I expect others may encounter it as FA5 adoption increases.

I had a quick look at the source but it appears to use a lot of regex that I'm not particularly familiar with but I believe it is this line causing the issue as .replace(/<.*?>/g, "") would match and remove <!-- <i class='fa fa-sort'>.
I believe adding .replace(/<!--.*?-->/g, "") in before that line to remove the entire commented section should sort it but hopefully someone with a better regex understanding can confirm.

allan

Thanks for letting me know about this. Its the nesting of the <> characters that is causing the issue. I completely agree with your solution and have committed it in.

I've also stripped comments from the exported data.

This will be in the next release of Buttons which I'm going to tag this afternoon .

Allan

adam@cuskit.co.uk

Awesome thank you