Input
Editors
Data
Charts & Maps
Panel & Layout
Overlay & Feedback
Media
Misc
Resources
Clipboard
Clipboard copies or cuts text to the OS clipboard. It shouldn't be hard and it shouldn't require dozens of steps to configure or hundreds of KBs to load, and it doesn't depend on Flash or any bloated framework. Based on Clipboard.js by Zeno Rocha.
Basic Usage
A pe:clipboard can have a fixed text or point to a text component with target.
The success and error events are sent to the server. Clipboard can be used in menu options too: right click the
page background to show the context menu.
Usage
<div class="card">
<h5>Basic Usage</h5>
<p>A <code>pe:clipboard</code> can have a fixed <code>text</code> or point to a text component with <code>target</code>.
The <i>success</i> and <i>error</i> events are sent to the server. Clipboard can be used in menu options too: right click the
page background to show the context menu.</p>
<h:form id="formBasicUsage">
<p:growl id="growl" showDetail="true" showSummary="true">
<p:autoUpdate/>
</p:growl>
<h:panelGrid columns="4">
<h:outputText value="Copy"/>
<p:inputText id="txtCopy" value="#{clipboardController.copyInput}"/>
<p:commandButton id="btnCopy" value="Copy" icon="pi pi-copy"/>
<pe:clipboard id="clipCopy" trigger="btnCopy" action="copy" target="txtCopy">
<p:ajax event="success" listener="#{clipboardController.successListener}"/>
<p:ajax event="error" listener="#{clipboardController.errorListener}"/>
</pe:clipboard>
<h:outputText value="Cut"/>
<p:inputText id="txtCut" value="#{clipboardController.cutInput}"/>
<p:commandButton id="btnCut" value="Cut" icon="pi pi-clipboard"/>
<pe:clipboard id="clipCut" trigger="btnCut" action="cut" target="txtCut">
<p:ajax event="success" listener="#{clipboardController.successListener}"/>
<p:ajax event="error" listener="#{clipboardController.errorListener}"/>
</pe:clipboard>
</h:panelGrid>
<h:panelGroup layout="block" style="text-align:left;margin:10px;">
<p:commandButton id="btnAjaxCopy" value="Ajax Copy" icon="pi pi-copy" onclick="return false;"/>
<pe:clipboard id="clipAjax" trigger="btnAjaxCopy" action="copy" text="#{clipboardController.lineBreaks}">
<p:ajax event="success" listener="#{clipboardController.successListener}"/>
<p:ajax event="error" listener="#{clipboardController.errorListener}"/>
</pe:clipboard>
<p:button id="btnNonAjax" value="Non-Ajax Copy" icon="pi pi-copy" href="#"/>
<pe:clipboard id="clipNonAjax" trigger="btnNonAjax" action="copy" text="PrimeFaces Clipboard Rocks Without Ajax!"
onsuccess="alert('Action: ' + this.action + ' Text:' + this.text);"
onerror="alert('Action: ' + this.action + ' FAILED!');"/>
</h:panelGroup>
<h:panelGroup layout="block" style="text-align:left;margin:10px;">
<h:outputText id="lblRightClick">Right click me to view the menu options!</h:outputText>
<p:contextMenu>
<p:menuitem id="mnuCopy" value="Copy" url="javascript:void(0);" icon="pi pi-copy"/>
</p:contextMenu>
<pe:clipboard id="clipContextCopy" trigger="mnuCopy" action="copy" text="#{clipboardController.copyInput}">
<p:ajax event="success" listener="#{clipboardController.successListener}"/>
<p:ajax event="error" listener="#{clipboardController.errorListener}"/>
</pe:clipboard>
</h:panelGroup>
</h:form>
</div>
package org.primefaces.extensions.showcase.controller;
import java.io.Serial;
import java.io.Serializable;
import jakarta.faces.application.FacesMessage;
import jakarta.faces.context.FacesContext;
import jakarta.faces.view.ViewScoped;
import jakarta.inject.Named;
import org.primefaces.extensions.event.ClipboardErrorEvent;
import org.primefaces.extensions.event.ClipboardSuccessEvent;
/**
* Clipboard Controller.
*
* @author Melloware [email protected]
*/
@Named
@ViewScoped
public class ClipboardController implements Serializable {
@Serial
private static final long serialVersionUID = 20120224L;
private String copyInput = "Test Copy!";
private String cutInput = "Cut Me!";
private String lineBreaks = "PrimeFaces Clipboard\nRocks Ajax!";
public void successListener(final ClipboardSuccessEvent successEvent) {
final FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_INFO, "Success",
"Component id: " + successEvent.getComponent().getId() + " Action: " + successEvent.getAction()
+ " Text: " + successEvent.getText());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public void errorListener(final ClipboardErrorEvent errorEvent) {
final FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_ERROR, "Error",
"Component id: " + errorEvent.getComponent().getId() + " Action: " + errorEvent.getAction());
FacesContext.getCurrentInstance().addMessage(null, msg);
}
public String getCopyInput() {
return copyInput;
}
public void setCopyInput(final String copyInput) {
this.copyInput = copyInput;
}
public String getCutInput() {
return cutInput;
}
public void setCutInput(final String cutInput) {
this.cutInput = cutInput;
}
public String getLineBreaks() {
return lineBreaks;
}
public void setLineBreaks(final String lineBreaks) {
this.lineBreaks = lineBreaks;
}
}