Datatables with custom sort AND Bootstrap tooltips don't work together

Question

Datatables with custom sort AND Bootstrap tool tips don't work together

<td style="text-align : center" data-sort="#modifydate#">
    <img src="assets/icon/properties.png" title="Modified: 
       #request.stdDate(ModifyDate)#<br />
       By: #ModifyBy#<br />
       Created: #request.stdDate(CreateDate)#<br />
       By: #CreateBy#" />
</td>

Javascript in application.js

$("[title]").tooltip({ html: true });


$('#datatable').dataTable({
    "deferRender": true,
    "paging": false
    });

The sorting works ok, but the tool tips disappear.

The tool tips work ok with not custom sort.

Answer 1

Try to use this in js:

$("body").tooltip({
    selector: '[data-toggle="tooltip"]',
    'trigger': 'hover',
});

and check if they have pointer-events: none in CSS.