Topic: Tooltip HTML messages not working

Ozcan Arslan pro asked 4 years ago

Expected behavior

HTML formatted Tooltip messages

Actual behavior

enter image description here

Resources (screenshots, code snippets etc.)

I am using MDB Pro v4.10.1 with Bootstrap v4.4.1. I want to use html formatted Tooltips but it isnot working. I did exactly as in docs both in getbootstrap and MDBootstrap nut still i get html codes in tooltips as it's shown in screenshot.

Ozcan Arslan pro answered 4 years ago


I am using Jquery Ui for multidatespicker component and i found that jQuery-ui tooltip addon doesn't support html rendering and if you jquery-ui.js file after mdb.js file it overlaps with MDBoostrap tooltip and disables html rendering feature.

To use MDBoostrap tooltip with all cool features just add jquery-ui.js just after jquery.js file if you need it.

Grzegorz Bujański staff commented 4 years ago

I understand that fix the problem and everything works fine now?

Ozcan Arslan pro commented 4 years ago

Yes. Everything related to Tooltip is working fine.

Akhil M free answered 9 months ago

I didn't work even though I added data-html="true" attribute but it worked when i used $('[data-toggle="tooltip"]').tooltip({ html:true })

lemons free answered 4 years ago

Here you go:

use the data-html="true" attribute.

Ozcan Arslan pro commented 4 years ago

I use exactly as you said and my code worked in your snipped but somehow it isnot working on my site. I used this way too:

$('[data-toggle="tooltip"]').tooltip({ html:true })

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.10.1
  • Device: Desktop, Mobile
  • Browser: Firefox, Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes