JAVA COPY TO CLIPBOARD
Its easy to copy text area by java script. Here are some example of copy
1. java script copy to clipboard - one text area
Text area define with content
<textarea id="textareaX" name="textareaX" rows="4" cols="50">I am text area one - click to copy </textarea>
Button add
<input type="button" value="Copy Example- 1" onclick="copy_to_clipboard_X('textareaX');">
Add java script
<script>
function copy_to_clipboard_X(textarea1)
{
document.getElementById('textareaX').select();
document.execCommand('copy');
}
Example -1
The final code looks like
<textarea id="textareaX" name="textareaX" rows="4" cols="50">I am text area one - click to copy </textarea><input type="button" value="Copy Example- 1" onclick="copy_to_clipboard_X('textareaX');"><script>function copy_to_clipboard_X(textareaX){document.getElementById('textareaX').select();document.execCommand('copy');}</script>
2. java script copy to clipboard - Two or multiple text area
Text area define with content
<textarea id="textarea1" name="textarea1" rows="4" cols="50">I am text area Two - click to copy </textarea><textarea id="textarea2" name="textarea2" rows="4" cols="50">I am text area Three - click to copy </textarea>
Button add
<input type="button" value="Copy Example- 2" onclick="copy_to_clipboard_2('textarea2');"><input type="button" value="Copy Example - 3" onclick="copy_to_clipboard_1('textarea1');">
Add java script
<script>function copy_to_clipboard_1(textarea1){document.getElementById('textarea1').select();document.execCommand('copy');}function copy_to_clipboard_2(textarea2){document.getElementById('textarea2').select();document.execCommand('copy');}</script>
Example -2 & 3
The final code looks like
<textarea id="textarea1" name="textarea1" rows="4" cols="50">I am text area one - click to copy </textarea><input type="button" value="Copy Example- 2" onclick="copy_to_clipboard_1('textarea1');"><textarea id="textarea2" name="textarea2" rows="4" cols="50">I am text area Two - click to copy </textarea><input type="button" value="Copy Example - 3" onclick="copy_to_clipboard_2('textarea2');"><script>function copy_to_clipboard_1(textarea1){document.getElementById('textarea1').select();document.execCommand('copy');}function copy_to_clipboard_2(textarea2){document.getElementById('textarea2').select();document.execCommand('copy');}</script>
3. Read only textarea
You may have noticed that the text area is editable . If you wish to make only read just add readonly attribute in text area code
<textarea id="textareaX" name="textareaX" rows="4" cols="50" readonly>I am text area one - click to copy </textarea>
4. Textarea style
You can add style according your content. As you may have noticed that there is border and you can resize the text area by dragging it. You can hide it too.
<textarea id="textareaX" name="textareaX" style="border:none; resize: none;" readonly>I am text area one - click to copy </textarea>