Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!

  1. MDB Home Page
  2. Support Main Page
  3. General Bootstrap questions
Topic: Tooltip not displaying correctly on 4.5.7

decosvaldo pro asked 6 years ago

Hi, I'm trying to set up a tooltip on a label next to a radio button. The label text appears, but a little far from where I set it and without the tooltip black box. On version  4.4.5 it works fine. But I'm working on an upgrade to 4.5.7 and it has this problem now. Popper.js and mdb.js are being correctly called. Don't know what to do anymore. My code is bellow:   
Start your code here
<div class="form-group radio-pink-gap radio-05 radio-80M-settings">
<input name="group-<?php echo $albumrow["id"];?>" type="radio" class="with-gap" value="0.5" id="1-<?php echo $albumrow["id"];?>">
<label class="small" data-toggle="tooltip" data-placement="left" title="Desastroso" for="1-<?php echo $albumrow["id"];?>">0,5</label>
</div>

$(function () {
$('[data-toggle="tooltip"]').tooltip()
}),

decosvaldo pro answered 6 years ago

Found it! Conflict with jquery.ui.

Piotr Glejzer staff commented 6 years ago

I'm happy that you found it! If you have more questions ask us. Have a nice day.

decosvaldo pro answered 6 years ago

Just upgraded to 4.5.8 and the problem remains.

decosvaldo pro answered 6 years ago

Can you guys please check if there is a bug with this version or something else to configure in the Tooltip?

Piotr Glejzer staff answered 6 years ago

Hi, this is my example and it is working but I don't use PHP. 

<div class="form-group radio-pink-gap radio-05 radio-80M-settings text-center">
 <input name="a" type="radio" class="with-gap" value="0.5" id="b">
 <label class="small" data-toggle="tooltip" data-placement="left" title="Desastroso" for="b">0,5</label>
 </div>


$(function () {
$('[data-toggle="tooltip"]').tooltip()
})

decosvaldo pro commented 6 years ago

Hi, I've pasted your code and even the radio button is not showing now, only the label. And the tooltip is the same, only the text appears on hover and without a black box. I am calling the tooltip function correctly, because the tip appears, but with this problem. I have also pasted a simple button with tooltip sample from the mdb website and the problem is the same. Php is filling the variables correctly. As I said, it was working before the code upgrade. Any extra thoughts?

decosvaldo pro commented 6 years ago

Using the website sample for the radio, it is not "form-group" and "with-gap" classes anymore for this new version. Is it "form-check" and "form-check-input" for the radio to work. But, as I said, even a simple button with tooltip is presenting the same issue.

FREE CONSULTATION

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

Closed

Specification of the issue
  • ForumUser: Pro
  • Premium support: No
  • Technology: General Bootstrap questions
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags
About author
decosvaldo
Pro User 42Support score
16Questions 10Answers 1Snippets