I have a page which sets facilities available in a building.
I have implemented this by means to two containers containing icons (font awesome icons).
One container has icons for facilities which have been added, the second those remaining available to add. each icon is wrapped in a form with some extra detail in hidden fields and a tooltip is added to show text describing the facility
Linked to the icons is a click action which performs a submit of the form which removes or adds the relevant facilties to/from a list.
This works well, clicking the icons does add and remove the icons as desired and the screen updated by reloading the connection.
HOWEVER if i linger with the cursor over the icon as i click the icons, the submit occurs, the icon disappears BUT the tooltip remains and the only way to remove it is to refresh the page.
I guess i may be using the tooltip a way it was not intended but a solution would be wonderful!
Video: tool-tip-issue.mp4 (662.9 KB)
Link to demo page: Click here
Last updated: