SergioKastro SergioKastro - 1 month ago 49
Javascript Question

Allow Copy/Paste in a disabled input text box in Firefox browsers

I have a input text box disabled:

<input type="text" name="name" disabled="disabled" />


In IE and in Chrome you can copy and paste the value populated in that input field but in Firefox you cannot.

Firefox does not allow clipboard manipulation through JavaScript for valid security concerns.

Any suggestion? Is there a work around this?

Answer

I don't like using readonly="readonly", ever. It leaves the field focusable and reachable via tab keypress and, if, god forbid, the user hits the backspace key while the read-only field is focused, then most browsers treat it like the user hit the 'back' button and bring up the previously viewed page. Not what you want to see happen when you're filling out a large form, especially if you are using some archaic browser that doesn't preserve the form data when you hit the 'next' button to return to it. Also very, very bad when using some single-page web application, where 'back' takes you to a whole other world, and 'next' doesn't even restore your form, much less its data.

I've worked around this by rendering DIVs instead of input fields when I need the field disabled (or PRE instead of a textarea). Not always easy to do dynamically but I've managed to make fairly short work of it with AngularJS templates.

If you have time, head over to the Mozilla Bugzilla and ask them to fix it.