HTML multi <textarea> "copy to clipboard" issues - need help

Uber_Tiny · Mar 24, 2010

So I am trying to figure out how to copy the text of multiple text fields, but have not been successful. I can get the main <textarea> to copy, but I would like to have it copy the forms as well. I know I can create the forms as a <textarea>, but not sure how to grab them all and have tried multiple things from research with no luck.

Any help is appreciated. Below is the entirety what I am currently working with. This is a project for work.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<HTA:APPLICATION 
        ID="oHTA"
        APPLICATIONNAME="NOTES"
        BORDER="thin"
        BORDERSTYLE="normal"
        CAPTION="yes"
        ICON=""
        MAXIMIZEBUTTON="no"
        MINIMIZEBUTTON="yes"
        SHOWINTASKBAR="yes"
        SELECTION="NO"
        SINGLEINSTANCE="yes"
        SYSMENU="yes"
        VERSION="1.0"
        WINDOWSTATE="normal"/>


<script LANGUAGE="VBScript">

'Change WindowSize
Self.ResizeTo 725, 425

</script>


<title>Notes Tool 1.0</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript">

function CopyToClipboard()

{

   document.Form1.txtArea.focus();

   document.Form1.txtArea.select(); 

   CopiedTxt = document.selection.createRange();

   CopiedTxt.execCommand("Copy");

}

</script>

</head>

<body bgcolor="000000" text="ffffff">

<table border="0">

<tr>

<th align="right" valign="center">
<form name="Form1">
First:
<input type="text" name="firstname" />
<br />
Last:
<input type="text" name="lastname" />
<br />
Phn:
<input type="text" name="Phone" />
<br />
Case:
<input type="text" name="Case" />
<br />
S/N:
<input type="text" name="S/N" />
<br />
P/N:
<input type="text" Name="P/N" />

</th>

<th align="right">
<textarea id="txtArea" rows="15" cols="50" style="overflow:hidden;">

Issue: 
Symptoms: 
Cause: na
Environment: 
CSO/ARM: 
ASG: no
LF Resolved?: Yes
Functionality Proven: YES
How Issue Was Resolved:

Reason For No Resolution: N/A
Refer To 3rd Party: N/A
</textarea>


<br />
<input type="button" onClick="CopyToClipboard()" value="Copy to clipboard" style="background-color:#000000; color: #ffffff;" />

</th>

</tr>
<tr>

<td>

</td>

<td align="right">
<input type="reset" style="background-color:#cc0000; color: #ffffff;" align="left"/>
</form>
</td

</tr>

</table>
 
</body>

</html>

Xenethyl · May 5, 2010

Late reply here (you may have already solved this), but I might approach it as follows:

Loop through all of your textarea fields and for each one, append the text in to a non-displaying div. Once you've copied all the text to the hidden div, you can just copy the completed set of content in one go. You could play around with where you actually copy the content to (such as the alt or title text for something), but I think a hidden div would work best. jQuery or Prototype would help quite a bit with this.

HTML multi <textarea> "copy to clipboard" issues - need help

Uber_Tiny

New member

Xenethyl

New member