search

enyo / opentip

Opentip is an open source javascript tooltip based on the protoype framework.
http://www.opentip.org
1.25k stars 401 forks source link

Opentip on disabled form element #51

Closed chrilleferna closed 11 years ago

chrilleferna commented 11 years ago

Hi Matias!

I noticed that if you attach an opentip to a form element (in my case a radio button), the tip stops showing if you disable that element. In my case I would like to pop up an explanation to the user for why the radio button is disabled. Is this a possible change?

Cheers and thanks for a very useful library -- christer

enyo commented 11 years ago

Hi... that should definitely not be the case. How do you disable the button?

chrilleferna commented 11 years ago

With a jQuery call to set the disabled attribute to true:

$('tr.disabled_presence_row .status_2').attr('disabled',true);

enyo commented 11 years ago

If you reenable the element, does the tooltip work again?

chrilleferna commented 11 years ago

Yes it does:

$('tr.disabled_presence_row .status_2').attr('disabled',true); $('tr.disabled_presence_row .status_2').attr('disabled',false);

and it works again

enyo commented 11 years ago

That is weird. Which browser are you using?

chrilleferna commented 11 years ago

Safari on osx. Let me try on Firefox - hang on...

chrilleferna commented 11 years ago

same thing with Firefox

chrilleferna commented 11 years ago

maybe all events are disabled on disabled elements, including focus?

enyo commented 11 years ago

http://stackoverflow.com/questions/3100319/event-on-a-disabled-input

This is a browser issue. Sorry ;)

chrilleferna commented 11 years ago

OK, so that explains it. The solution proposed on stackoverflow: "I can't think of a better solution but, for complete cross browser compatibility, you could place an element in front of the disabled input and catch the click on that element." was also the workaround I planned to use.

Thanks for your help!

enyo commented 11 years ago

No problem. I'd try attaching Opentip to the container element of your select box, and see if mouse events bubble to the parent in recent versions of FF. (The answer on stackoverflow is pretty old)

chrilleferna commented 11 years ago

Yes, I did that already and it works, but in my quick fix the radio button is on top of the container so when you hover right above it, the tooltip doesn't show, There was a link on stackoverflow to a quite nice solution, where you have jQuery inserting an overlay element: http://blog.pengoworks.com/index.cfm/2010/4/23/Attaching-mouse-events-to-a-disabled-input-element