Trying to copy text to clipboard when selecting an option from a drop down menu

Question

I have created a drop down menu which contains a list of options. I would like to be able to select one of those options, and once selected I would like it to execute a function that copies text from a notepad (.txt file) to my clipboard and alerts me that it's been copied..

This is what I have so far:

<!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">


<title>Dropdown Test</title>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.1.1.min.js"></script>
<script type="text/javascript" language="Javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script>
function changeOptions(){
$('select[name="dropdown"]').change(function(){

if ($(this).val() == "option1")
    function1();
else if ($(this).val() == "option2")
    function2();
else if ($(this).val() == "option3")    
    function3();
else if ($(this).val() == "option4")
    function4();
else if ($(this).val() == "option5")    
    function5();



});

}
</script>


<script type="text/javascript"> 

function function1(){
$(function()

{
var page_name="textfile.txt";

    $.get(page_name, function(data)
    {
            if (window.clipboardData) {
    window.clipboardData.setData('text', data);
} 

            alert("The text from textfile.txt has been copied to your clipboard! ");
    });
});
}
 </script>







 <body onload ="changeOptions()">

<select name="dropdown" size=1>
<option>Select options below...</option>
<option value="option1">Text file1</option>
<option value="option2">Text file2</option>
<option value="option3">Text file3</option>
<option value="option4">Text file4</option>
<option value="option5">Text file5</option>

</select>
</body>
</html>

So the problem here is that it APPEARS to work as when you select from the drop down menu, you get the alert to say " The text from textfile.txt has been copied..." However, it doesn't copy and I don't know what else to do! I have tried this function with a button and 'onclick' and it works, successfully copying the text to the clipboard!

Please help!

I appreciate it! :)

http://jonrohan.github.io/ZeroClipboard/ – Timmerz Apr 24 '13 at 20:09 — Timmerz, Apr 24 '13 at 20:09

score 0 · Answer 1 · answered Apr 24 '13 at 20:08

0

You cannot access (copy/paste) to the system clipboard on the client.

To do so would be a security issue. You could read sensitive data from it, or paste malicious content into it.

answered Apr 24 '13 at 20:08

fisharebest

1,152
9
16

Hi, thanks for the response, but the thing is, you can since I have it working with an 'onClick' in an alternate version of this code! – user2317122 Apr 24 '13 at 20:10
I guess you are using Internet Explorer? It has a clipboard API. Other browsers do not. – fisharebest Apr 24 '13 at 20:18

score 0 · Answer 2 · edited May 23 '17 at 11:57

0

See: How to copy to the clipboard in JavaScript?.

Most browsers don't support modifying the user's clipboard directly with javascript for security reasons. There are work arounds using Flash, such as ZeroClipboard

edited May 23 '17 at 11:57

Community

1
1

answered Apr 24 '13 at 20:09

Samutz

2,224
4
24
28

I've just tested this in Internet Explorer and it actually works which is great for what I needed! :D – user2317122 Apr 24 '13 at 20:17

Trying to copy text to clipboard when selecting an option from a drop down menu

2 Answers2