Hello,
I am trying to build a "Copy To Clipboard" button for one of my VF pages.
I found the code below on GitHub (will attribute author at bottom), but it displays the text to be copied in an output field. The functionality works just as I want it to, but I don't want to display the text, I just want to store it behind the button. Can anyone help me convert the OutPutPanel portion to a stored variable? I've been playing around with this for a while and can't figure it out. Here is the code:
<apex:page title="Clipboard Test" >
<apex:messages />
<script language="JavaScript">
function ClipBoard(copytextid, holdtextid){
copyToClipboard(copytextid);
}
function copyToClipboard(elementId) {
// Create an auxiliary hidden input
var aux = document.createElement("input");
// Get the text from the element passed into the input
aux.setAttribute("value", document.getElementById(elementId).innerHTML);
// Append the aux input to the body
document.body.appendChild(aux);
// Highlight the content
aux.select();
// Execute the copy command
document.execCommand("copy");
// Remove the input from the body
document.body.removeChild(aux);
}
</script>
<apex:pageblock >
<apex:form >
<apex:outputpanel ID="copytext" STYLE="height:150;width:162;background-color:pink">
TEXT TO BE COPIED
</apex:outputpanel>
<apex:inputtextarea ID="holdtext" STYLE="display:none;"></apex:inputtextarea>
<apex:commandbutton onClick="ClipBoard('{!$Component.copytext}', '{!$Component.holdtext}');" rerender="copytext" value="Copy to Clipboard"/>
</apex:form>
</apex:pageblock>
</apex:page>
**Source:
https://gist.github.com/nithesh1992/dc66708bde9ab94313a731a715fef9ad⌗file-copy-txtI want to accomplish something like this:
So that the only visable piece is the button. Can anyone help me with this?!Thank you, and happy thanksgiving!<apex:variable ID="copytext" value="TEXT TO BE COPIED" "/>
<apex:inputtextarea ID="holdtext" STYLE="display:none;"></apex:inputtextarea>
<apex:commandbutton onClick="ClipBoard('{!$Component.copytext}', '{!$Component.holdtext}');" rerender="copytext" value="Copy to Clipboard"/>
hi john try this one, : <apex:outputpanel ID="copytext" STYLE="height:150;width:162;background-color:pink;display:none"> TEXT TO BE COPIED </apex:outputpanel>i hope it helps you. Let me inform if it helps you and kindly mark it best answer if it helps you so it make proper solution for others thankshttp://sfdcmonkey.com
