Topic: Tooltips Disappear when using DataTables
I have a tooltip in a datatable which works only when the page first loads.
However any change made to the data table (ex sorting or searching) causes the tooltip to disappear.
I tried re-initializing the tooltip (code below) but that didn't work.
function reinitializeToolTips(){
const tooltips = document.querySelectorAll('[data-mdb-toggle="tooltip"]')
tooltips.forEach((tooltip) => {
const tooltipInstance = new mdb.Tooltip(tooltip);
});
}
Is there a way to ensure the tooltips can automatically be re-enabled (re-initialized) after a change is made to the table?
Thank you
I've updated your snippet to demonstrate how you can reinitiate tooltip: https://mdbootstrap.com/snippets/standard/kpienkowska/4209327
I am not sure what you use the tooltip for so I am not sure how can I help. Can you show your current datatable in snippet?
For now, I can only say that if initializing works at first you can watch when datatable render and after every event render initiate tooltip.
Can you please provide code to watch for a datatable render?
Thank you!
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 3.11.0
- Device: Desktop
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: No