0

I am trying to enable textarea on double click but its not working:

<textarea name="manuf_comment[]" disabled ondblclick="this.disabled=false" ><?php echo $cases["manuf_comment"]; ?></textarea>

What am I doing wrong here? P.S: I want to do this in the element without calling JavaScript functions externally if possible.

showtime
  • 1
  • 1
  • 17
  • 48
  • The problem lies on the disabled textarea, it won't react on doubleclicks when once disabled. – Teemu Jul 02 '20 at 15:11
  • You're not doing anything wrong, just disabled inputs(or textarea) do not fire mouse events, here's a [solution](https://stackoverflow.com/questions/3100319/event-on-a-disabled-input) for that – Vahe Yavrumian Jul 02 '20 at 15:12
  • @VaheYavrumian what about backgroundcolor, can I change it doing this? – showtime Jul 02 '20 at 15:20
  • 1
    change backgroundColor by double click? I think you won't have any problem, but if there's anything, ask here, I'll help as much as I can – Vahe Yavrumian Jul 02 '20 at 15:22
  • @VaheYavrumian thank you! I am doing it like this but it doesn't change the background color: `style="backgroundColor: lightgray;" onchange="this.readOnly='true'; this.parentNode.style.backgroundColor='lightgray'" ondblclick="this.readOnly=''; this.parentNode.style.backgroundColor='white'"` . I tried with `color` and it works by changing text color. – showtime Jul 02 '20 at 15:30
  • 1
    I tried to run this code in codepen, it works perfectly, just `onchange` event fires only when you click outside textarea – Vahe Yavrumian Jul 02 '20 at 15:39
  • @VaheYavrumian fixed it! I removed the parentnode – showtime Jul 02 '20 at 15:39
  • Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/217094/discussion-between-vahe-yavrumian-and-ttt). – Vahe Yavrumian Jul 02 '20 at 15:39

1 Answers1

0

You can't make an ondblclick event on disabled texarea's please put it intro a div and make the ondblclick event there.

<div ondblclick="enable(this)">
  <textarea name="manuf_comment[]" disabled ondblclick="hh(this)" >asdasd</textarea>
</div>​

<script>
function enable(div){
  div.getElementsByTagName("textarea")[0].disabled = false;
  console.log('sad');
}
</script>
David H.
  • 11
  • 1