events on disabled fields

@mcherneckiJun 29.2004

I have an order form which disables fields through cgi as the form loads. I need to display a tooltip explaining why a certain field is disabled as the user mouseovers or clicks on the disabled select or text field. But, since this field was disabled, I can’t catch any event on it. Is there a way for me to receive a mouse event on these disabled fields so that the tooltip can be displayed.

Thanks
Mike

to post a comment

JavaScript

@crh3675Jun 29.2004 — #

<i>
 </i>&lt;html&gt;
 
 
 &lt;script type="text/javascript"&gt;
 
 function setOverlay(){
 var item1=document.getElementById("inputItem");
 var item1overlay=document.getElementById("inputItemOverlay");
 
 <i>	</i>item1overlay.style.left=item1.offsetLeft+"px";
 <i>	</i>item1overlay.style.top=item1.offsetTop+"px";
 <i>	</i>item1overlay.style.height=item1.offsetHeight+"px";
 <i>	</i>item1overlay.style.width=item1.offsetWidth+"px";
 }
 
 
 &lt;/script&gt;
 
 &lt;style&gt;
 #inputItemOverlay{
 position:absolute;
 visibility:visible;
 background-color:transparent;
 }
 &lt;/style&gt;
 
 &lt;body onload="setOverlay()"&gt;
 
 &lt;form&gt;
 &lt;input type="text" size="50" id="inputItem" disabled="disabled"/&gt;
 
 &lt;div id="inputItemOverlay" onmouseover="alert('overlay')"&gt;&lt;/div&gt;
 &lt;/form&gt;
 
 &lt;/body&gt;
 &lt;/html&gt;

@mcherneckiauthorJun 30.2004 — #I tried the sample code you provided, but it did nothing ? Not sure what I did wrong.

@PittimannJun 30.2004 — #Hi!

The code, crh3675 posted for you works (in DOM browsers). I was just wondering a bit about 'disabled="disabled"', where 'disabled' would have to be put.

As far as text fields or textareas are concerned, you could simply replace 'disabled' with readonly and your events will fire without giving the user a chance to do something with the field. For select tags, radios, checkboxes, you could add some 'onclick="alert('This field is disabled because...');return false;"' without giving them the attribute...

Graying the fields in question out (background color) could help the user to see that these fields are not changeable or selectable.

Cheers - Pit

@mcherneckiauthorJun 30.2004 — #Ok, it works fine for me now. I changed background-color from transparent to any color and it works fine. If I set the background back to transparent it does not work. Thanks for the help!

Mike

events on disabled fields

4 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

events on disabled fields

4 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

4 Comments(s) _↴

Also in #JavaScript _↴