Copy to clipboard does not work when loaded with ajax call
- by kylex
I have the following code which works the way one would expect (click on the button and it copies the text in the input box):
<script type="text/javascript" src="ABSOLUTE_LINK/ZeroClipboard.js"></script>
<script type="text/javascript">
ZeroClipboard.setMoviePath( 'ABSOLUTE_LINK/ZeroClipboard.swf' );
</script>
Copy to Clipboard: <input type="text" id="clip_text" size="40" value="Copy me!"/><br/><br/>
<div id="d_clip_button">Copy To Clipboard</div>
<script language="JavaScript">
echo "var clip = new ZeroClipboard.Client();
clip.setText( '' ); // will be set later on mouseDown
clip.setHandCursor( true );
clip.setCSSEffects( true );
clip.addEventListener( 'load', function(client) {
} );
clip.addEventListener( 'complete', function(client, text) {
alert("Copied text to clipboard: " + text );
} );
clip.addEventListener( 'mouseOver', function(client) {
} );
clip.addEventListener( 'mouseOut', function(client) {
} );
clip.addEventListener( 'mouseDown', function(client) {
// set text to copy here
clip.setText( document.getElementById('clip_text').value );
} );
clip.addEventListener( 'mouseUp', function(client) {
} );
clip.glue( 'd_clip_button' );
</script>
However, when this code is loaded using an ajax call, the functionality disappears. Is there anything I can do to get this working when it's called via ajax?
