Moodle ToolTips not working

Moodle ToolTips not working

by Colin Cruikshank -
Number of replies: 3

Hi,

We are using a theme based on boost. The tooltip icons (the little question marks next to form fields) that I assume provide help information about moodle form fields do not do anything when clicked on.

I can confirm that clicking on one does not do anything when the Classic, Boost and our custom themes are applied.

Is there a way to enable these tooltip icons?

Thanks.

Average of ratings: -
In reply to Colin Cruikshank

Re: Moodle ToolTips not working

by Leon Stringer -
Picture of Core developers Picture of Particularly helpful Moodlers

Which version of Moodle is this?

The pop-up help is shown by some JavaScript so presumably that's not working for some reason. If you open your browser's console (for example: Web Console on Firefox) are there any errors when you click on the icons?

Also, try purging all caches.

Average of ratings: -
In reply to Leon Stringer

Re: Moodle ToolTips not working

by Colin Cruikshank -
This is Moodle 3.11.2+ (Build: 20210902)

I did a fresh install of moodle on a different machine, and it looks like the tooltips work right out the box. Seems like something on our end is preventing the modal from displaying. I have purged caches many times.

There are no errors in the console when clicking on the icons. I notice that in both the version that works and the version that doesn't, when I click on the icon, the an attribute is added to the element containing the icon. The attribute is "aria-describedby="popoverXXXXX". But despite this, the modal does not pop out on our theme'd version.

I'll have to do some more debugging. If anyone has any thoughts let me know! Clearly something we've done has clobbered the javascript. Trouble is finding it smile
Average of ratings: -
In reply to Colin Cruikshank

Re: Moodle ToolTips not working

by Colin Cruikshank -
Finally figured it out.

Our enrol plugin uses some CSS to interact with a form from a 3rd party provider. The css file contains a class selector called .fade{} which sets the opacity of that class to 0. Coincidentally, JQuery must apply this class to the modal popup from the tooltips because this line was the culprit. Commenting it out causes the tooltip popup to appear like normal.

Thanks, for the help, case closed.
Average of ratings: Useful (1)