I want to be able to place text in a textarea, and copy it to the clipboard, without displaying the textarea.
To copy the text to the clipboard, I create a button with
onclick = "document.getElementById('txtData').select(); document.execCommand('copy');"
and this works fine.
However, if I try to hide the textarea using either
strStyle = 'display:none;'
strStyle = 'visibility:hidden;'
as per
If I want my textarea to be hidden, how do I do it?
then the copy no longer works. The textarea is hidden in both cases, but I have checked the source HTML and the text I want is still there - it's not like hiding the textarea means its contents aren't actually available.
If a full example is appropriate, here's one I took from http://www.jstips.co/en/javascript/copy-to-clipboard/
<head>
<script type='text/javascript'>
function c2cb () {
document.getElementById("txtInvoice").select();
document.execCommand('copy');
}
</script>
</head>
<body ><form id="frmAdminConsole" name="frmAdminConsole" METHOD="POST">
<textarea id='txtInvoice' cols='80' style = 'visibility:hidden;'>
46
JOHN SMITH
GAEL SCOIL NA BFHAL
34 A IVEAGH CRESENT
BELFAST
BT12 6AW
Bubble Ball Football [2017-02-03 09:00] 20 190.00
Nerf Wars [2017-02-05 10:00] 14 190.00
TeamTrek [2017-02-06 12:00] 20 0.00</textarea>
<input type="button" value="Copy!" onclick="c2cb()">
This doesn't work until I remove " style = 'visibility:hidden;'" .
I had what I thought was a D'oh! moment and said "I should use a hidden control", but it doesn't work either.
I would settle for a way to hide the textarea by stealth (make it the same colour as the background or something).
