Joe Joe - 1 year ago 79
Javascript Question

Bootstrap Tooltips not going away when they are cloned

Warning: I have virtually no experience with javascript, html, etc These are the tooltips I am using.

So the tooltips themselves are working completely fine for everything for our web interface... except for one detail.

They don't go away if the thing they are one is cloned while tooltip is showing.


Suppose you have a table, and each row has a + sign at the end, where if you click on that sign that row you clicked on gets duplicated. (HTML below)

The + sign comes with a tooltip that pops up saying "Duplicate this row". If you move mouse over and away, the tooltip shows and goes away properly. BUT if you click on the + sign, the tooltip if it was showing will just stay there and not go away.

<SPAN rel="tooltip" data-content="Duplicate this row" title="Duplicate this row" data-html="true">
<input class='submit' type="image" name="Add" class="submit" onClick="this.form.appendChild(getInputNode({'type':'hidden','name':'Add','value':'1'}));cloneRow(this);return false;" height="12" value="1" src="/images/icons/plus.gif" width="12" alt=''/>

This HTML is generated by our perl code which just outputs that HTML based on the options you give it.

I don't see anything in Bootstrap tooltip options to make this the tooltip go away with say a timer or something (which would solve this problem). Does anyone have any suggestions?

Joe Joe

Never mind. This turned to be a simple issue where all you have to do is tell one of the functions being called onClick to $(this).tooltip('hide');