JavaScript - Copy Text Box

I have a small snippet of code which will copy the contents of a textbox to the clipboard when a small image, say a button, is clicked.

I want to achieve a similar effect when I click a hotspot on an image, but in this case the text will have to come from...well, I don't know. Maybe the title in an area tag?

This is what I have so far for a textbox:

Code:

//clipboard copy
function ClipBoard(what){
Copied = document.getElementById(what).createTextRange();
Copied.execCommand("Copy");
alert ("Information copied to the clipboard. Use CTRL-V to paste."); 
}

<textarea id="holdtext1"></textarea> <img border="0" src="copyclick.gif" onclick="ClipBoard('holdtext1');" alt=" Click to copy text to clipboard / CTRL-V to paste" style="cursor: hand" width="18" height="18">

Does anyone have any ideas?

since there are troubles with innerHTML in IE .....

instead of :

Code:

target.innerHTML = src.innerHTML;

-->

Code:

  this.copy_innerHTML = function(src,target)
  {
    //remove all target inner elements
    while(target.hasChildNodes()){target.removeChild(target.childNodes[0])}

    for (var j = 0; j<src.childNodes.length-1; j++)
    {
       target.appendChild(src.childNodes[j].cloneNode(true));
    }

  }

a) Tested in FF and GC

b) in IE this works, but stuff does not appear where it should.

EDIT: if text nodes removed , then even in ff does not work, does not find textarea inside target node.
That is, the error pops up, previously only notable at IE. HTML & CSS validation is OK.

Any advice ?

I have this line of code:

<input type='text' id='fCode' style="width:875px; height:22px;"/><br /><br />

Does anyone know how to add a copy button to so when you click it it copies everything in the box to your clipboard?

Thanks

-Wardman

Don't even know where to post this as I have never thought about it;

I've just made my game have a image upload script in, and a album showing the users images. How could I make have a link saying "Copy Link" that if clicked will copy the picture url to clip board.

I've seen places like w3schools use in but not as tuts though.

Please this will really help, desplayin the link is ugly

EDIT:

I've found the following code but I don't understand how I turn it into a link or button.

Code:

<script> 
window.clipboardData.setData('text','This has been copied to your clipboard.'); 
</script>

I have this line of code:

<input type='text' id='fCode' style="width:875px; height:22px;"/><br /><br />

Does anyone know how to add a copy button to so when you click it it copies everything in the box to your clipboard?

Thanks

-Wardman

Hello, I am needing help in copying a url to another href on a page. Here is the scenario:

I have a page with multiple <LI>. Within each <LI> there is
A hidden link An image A visible link
This is the code within each <LI>:
Code:

<h2 class="postTitle" style="display: none;"><a href="URL to copy">LI Name</a></h2>
<a href="Copied URL"><img alt="" src="LI Image" /></a>
<a href="Copied URL">LI Name</a>

Each <LI> will contain a different image, LI name, and link. I am needing a way to get the hidden URL for each LI copied into the visible href. Hope this makes sense. Thanks in advance for your help.

do anyone know how do make a form that automatic tab when we paste something into the box and sort it out automatically. Like cd-key box. when we copy n paste cd-key into the box it automatic inert everything into correct places.

Thanks

Hey guys, I have a small page that reads from a mysql db and pretty much makes a row on the page for every row in the db, but, i need a way to have it so that when i click on a link from each row, it should automatically copy one of a cell from the db. so i have 3 columns in the DB: SITECODE, SALESCODE, and DEALERNAME, on my html page I have 4 colums, SITECODE, SALESCODE, DEALERNAME, and one that has a link which has a URL in it and adds the SITECODE automatically into it for each row.

I need it so that when i click on the link for each row, it automatically copies to the clipboard the SALESCODE for that row. This is what I have so far, but it does not work for some reason.

Code:

<script type="text/javascript">
function copy_to_clipboard(text)  
  {  

      if(window.clipboardData)  
      {  
        window.clipboardData.setData('$myrow[salescode]',text);  
      }  
	  else  
      {  



      }  
      return false;  
  }
</script>[/B]
<?php

// load the configuration file.

include("page-config.php");

        //load all news from the database and then OREDER them by newsid

        //you will notice that newlly added news will appeare first.

        //also you can OREDER by (dtime) instaed of (news id)

        $result = mysql_query("SELECT * FROM salescode ORDER BY sitecode ASC",$connect);

        //lets make a loop and get all news from the database

        while($myrow = mysql_fetch_assoc($result))

             {//begin of loop

               //now print the results:
               echo "<tr><td width=\"25%\" valign=\"top\" bgcolor=\"615B67\" class=\"news\" style=\"border-bottom:1px dashed #A49FA5;border-left:1px solid #A49FA5;padding-top:.5em;padding-left:.5em;padding-bottom:.5em;\" align=center><table align=center width=\"100%\"><tr><td align=left><font size=\"2px\" color=\"ffcc00\"><b>";

               echo $myrow['sitecode'];
			   
               echo "</b></font></td></tr></table></td><td align=\"center\" width=\"50%\" valign=\"top\" bgcolor=\"615B67\" class=\"events\" style=\"border-bottom:1px dashed #A49FA5;\"><table align=center width=\"100%\"><tr><td width=\"50%\" class=\"events\" align=center><u>";
   
               echo $myrow['salescode'];

               echo "</u></td><td width=\"50%\" class=\"events\" align=left>";
			   
			   echo $myrow['dealername'];
			   
			   echo "</td></tr></table>";
			   			   
			   echo "</td><td align=\"right\" width=\"25%\" valign=\"middle\" bgcolor=\"615B67\" style=\"border-right:1px solid #A49FA5;border-bottom:1px dashed #A49FA5;\"><a onclick=\"copy_to_clipboard('text')\" target=\"_blank\" href=\"https://testing/loadSiteInfo.do?branch=usa&siteCode=$myrow[sitecode]\"><font size=\"2px\"><b>";

			   echo $myrow['sitecode'];

			   echo "</b></font></a>&nbsp;&nbsp;</td></tr>";
			   
             }//end of loop

?>

I have a copy to clip board function in a page for short cut notes but currently it is enbeded with several copy to options ... hear is a part of the code ...
[code]
<html>
<head>
<title>Case Shortcut 1.0</title>
</head>

<SCRIPT language=JavaScript

src="xxxxxxx"></SCRIPT>

<BODY bgcolor=cccccc onload="loadPin('one')">

<table border="0" bordercolor="#000000" style="background-color:#FFFFCC" width="500" cellpadding="3" cellspacing="3">
<tr>
<td>
<SCRIPT LANGUAGE="JavaScript">


function ClipBoard1()
{
holdtext1.innerText = copytext1.innerText;
Copied1 = holdtext1.createTextRange();
Copied1.execCommand("Copy");
}

</SCRIPT>

<SPAN ID="copytext1" STYLE="height:*;width:300;background-color:White">
xxxxxx. I called and left message with callback number and pin. Callback Number: bbbbbbbbbbb PIN
<SCRIPT language=JavaScript src="http://doris/res/scripts/datePin.js"></SCRIPT>
<SPAN id=datepinHolder></SPAN></SPAN>

<TEXTAREA ID="holdtext1" STYLE="display:none;">
</TEXTAREA>
<BUTTON onClick="ClipBoard1();">Copy Note</BUTTON>
<p>
<SCRIPT LANGUAGE="JavaScript">

function ClipBoard11()
{
holdtext11.innerText = copytext11.innerText;
Copied11 = holdtext11.createTextRange();
Copied11.execCommand("Copy");
}

</SCRIPT>

<SPAN ID="copytext11" STYLE="height:*;width:250;background-color:White">
5 Day Pending close Message Left on Voice Mail.
</SPAN>
<TEXTAREA ID="holdtext11" STYLE="display:none;">
</TEXTAREA>
<BUTTON onClick="ClipBoard11();">Copy Note</BUTTON>
<p>

<SCRIPT LANGUAGE="JavaScript">

function ClipBoard10()
{
holdtext10.innerText = copytext10.innerText;
Copied10 = holdtext10.createTextRange();
Copied10.execCommand("Copy");
}

</SCRIPT>


<SPAN ID="copytext10" STYLE="height:*;width:250;background-color:White">
xxxxxx. Unable to leave Voice Mail will contact again on
</SPAN>
<TEXTAREA ID="holdtext10" STYLE="display:none;">
</TEXTAREA>
<BUTTON onClick="ClipBoard10();">Copy Note</BUTTON>
<p>
[code]
Is there a way that I code not have to repate code ... can it be condinced.

I need help in a form so that a radio button input sets 2 NAME values like NAME="name1" and NAME="name2"

Since I don't think this is possible, I would by happy to copy the value of name1 to name2 via a script/vb/java, etc.

Here's the code snippet I have that needs help.

<form action="https://www.paypal.com/cgi-bin/webscr" method="post">
<input type="hidden" name="business" value="99999999999">

<table border="0">
<tr><td><input type="radio" name="name1" value="25.00">Donate $25
<tr><td><input type="radio" name="name1" value="90.00">Donate $90
<td><td><input type="radio" name="name1" value="Other">Other Amount</td><td>
<td>$</td><td><input type="text" name="name1">
</table>


[Now, I need code to auto set NAME="name2" to always be the same value as "name1" above even if user re-selects choice]


..
..
..
</form>


Thanks Dave

how can i copy the contents of the fields in this form so that i can just paste it anywhere? thanks!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<SCRIPT LANGUAGE="JavaScript">

function copy(other)
{
var tempval=eval("document."+other)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
}
</script>
</head>

<body>
<form id="other" name="other" method="post" action="">
<p>DSL Number:
<input type="text" name="phonenumber" />
</p>
<p>Full Name:
<input type="text" name="fullname" />
</p>
<p>Country:
<input type="text" name="country"/>
</p>
<p>
<textarea name="txtarea" id="txtarea" cols="45" rows="5"></textarea>
</p>
<p>
<input type="button" value="Copy" onclick="copy();" />
</p>
</form>
</body>
</html>

Hi guys (and ladies)

I am a bit stuck and hope this community might shine a light, or even better can supply me with a solution.

I want to do the following:
- Having an ordinary webpage containing links
- I will link the links with files (word processing files , MS Word, Open Office writer, wordpad or similar)
- Now when clicked on the link I want the 'system' to copy the contents of the linked file to the windows clipboard, so when clicking paste, the text from the file is pasted wherever I want.

To make clear, I don't want any word processing app to open, just click the link and paste where it needs to be. Possible?? MOST LIKELY but I have no clue how.

Any chance someone might know the answer???
I am looking forward to the replies!

Thanks
PvL

I am not that great with web design but i am trying to create something like this site http://www.avrilbandaids.com/voteomatic/

I am trying to make something for my site - andygrammernation.com that is similar to this but with a different color scheme and with the mediabase link changed to vote for Andy instead of Avril. If anyone knows how to do this and would like to walk me through it that would be amazing!!!

Thank you all so much!!!

Hi,

i have several links which i am trying to add an on click command to which copies a certain code to the clip board so the user can paste the code with out having to manually copy it first.

i have this
Code:

        $latest = simplexml_load_file('codes_ending_soon.xml');
        foreach ($latest->discount as $discount)
        {
            $code = $discount->id;
            $link = $discount->link;
            $store = $discount->storeName;
            $logo = $discount->logo;
            $details = $discount->details;
            if($code_count <=4)
            {?>
                <div class="code_cont">
                <div class="code_logo"><img src="<?php echo $logo?>" alt="<?php echo $store." code"?>" title="<?php echo $store." code"?>" height="32" /></div>
                 <a class="code" href="<?php echo $link?>" title="Click to see related product(s) / retailer and apply code" onclick="window.clipboardData.setData(<?php echo $code?>)"><?php echo $code?></a> 
                <div class="description"><?php echo $details?></div>
                </div><?php
                $code_count++;
            }
        }?>

but when i click on the link nothing seems to copy at least in firefox anyway? can anyone help me please

thanks
Luke

how to copy some text to the clipboard with jquery or javascript, from google. i know there

is a pludgin named zeroclipboard http://code.google.com/p/zeroclipboard/ can do this with

cross browers. when i tested it on my site. i set it to copy text optionally . it can't work.

my test link is http://xanlz.com/copy/1.html

it always copys all the values. even i uncheck some check box. may be the value doesn't be changed. but when i alter() the variable, the value is ok. how to correct it? thank you.

i want it can copy the checked box value. if the box unchecked, then don't copy its value.