Having a input readonly i cannot copy value

Question

I'm having trouble with input text that are readonly and have a placholder text. I cannot copy the text in chrome.

If the text is selected with the mouse and then CTRL + C, the text is not copied
If the text is double-clicked and then CTRL + C, the text is copied
If the text with double click of mouse and in the context menu of the mouse is selected the option to copy, the text is copied

<p>If the text is selected with the mouse and then CTRL + C, the text is not copied</p>
<p>If the text is double-clicked and then CTRL + C, the text is copied</p>
<p>
If the text with double click of mouse and in the context menu of the mouse is selected the option to copy, the text is copied</p>


<form>
<input type="text" value="123" placeholder="123" readonly="readonly"/></form>

Fiddler: https://jsfiddle.net/sjtwdov3/26/

I tried searching for this problem but couldn't find any help. Have you encountered any of this? Is this a known chrome issue.

If I click and drag to highlight the text and press Ctrl + C it copies for me. — Joseph Webber, Aug 27 '18 at 16:56
duplicate? https://stackoverflow.com/questions/8876928/allow-copy-paste-in-a-disabled-input-text-box-in-firefox-browsers — Ggg, Aug 27 '18 at 17:00
Perhaps someone can provide a clean solution, but put simply, the issue you are having is a result of the focus state not being applied to the input when you highlight the text. — Adam Chubbuck, Aug 27 '18 at 17:07

James Allen · Answer 1 · 2018-08-28T19:53:11.993

0

Editted - Since it's being passed through a form use a hidden field below with a name attribute to pass the value through the form.

<input type="text" value="123" placeholder="123" disabled />
<input type="hidden" value="123" name="fieldName" />

edited Aug 28 '18 at 19:53

answered Aug 27 '18 at 17:10

James Allen

969
4
16

I updated my question to have the input sorrounded by a form. The problem with disabled, is that some browsers (like firefox) disable the copy feature if the input is disabled – Mlk Luis Esprança Aug 27 '18 at 17:34
Yes that is true. A possible solution would be to have a hidden input beneath the disabled input like so: Also note that I added a name attribute to the hidden field, so that it's value is accessible by the form handler. (Sorry I am new to S/O, not sure how to format code in comments) – James Allen Aug 27 '18 at 17:53

Having a input readonly i cannot copy value

1 Answers1