Hello Guys,

In this blog post, I am going to share the ‘Copy To Clipboard’ functionality in the lightning component using javascript. While working with the records in Salesforce sometimes user needs the record link to share in an email or need to use in the documentation or somewhere else.

This component will copy the record link in the clipboard in just a single click, the user does not need to copy the record link from browser URL. The component can be used for every standard and custom object, the user just needs to add the component on the object detail page and needs to click on the link button icon, the record link will be copied in the clipboard.

Find the full component code below.


<aura:component controller="copyToClipboardCntrl" implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
<aura:attribute name="recordId" type="string" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />
<aura:attribute name="wrapperObj" type="Object"/>
<div class="slds">
<div class="slds-grid">
<div class="slds-col slds-size--12-of-12">
<div class="slds-page-header" style="border-radius: 0px; border-right: 0px;border-left: 0px;border-top: 0px;
box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0.1);">
<lightning:icon iconName="utility:copy_to_clipboard" alternativeText="Copy To Clipboard" size="small" />
<table class="slds-table slds-table--bordered">
<lightning:icon iconName="{!v.wrapperObj.iconName}" alternativeText="{!v.wrapperObj.iconName}" size="small" />
<lightning:buttonIcon title="{!v.wrapperObj.recUrlLink}" aura:id="link" value="{!index}" iconName="utility:link" alternativeText="Link" onclick="{!c.copyLink}"/>
view raw copyToClipboardCmp hosted with ❤ by GitHub


doInit : function(component, event, helper) {
//get the object details from apex
//dynamically creating html component
var hiddenInputEle = document.createElement("input");
//get the title of clicked element (record link)
let val = event.getSource().get("v.title");
//set value attribute as actual record link
hiddenInputEle.setAttribute("value", val);
//append the element in the document body
// select the content
// Execute the copy command
//Show toast message after link copied in the clipboard
var toastEvent = $A.get("e.force:showToast");
mode: 'sticky',
title: 'Success!',
message: 'Link has been copied to clipboard.',
type: 'success'


getsObjectName : function(component, event, helper) {
let action = component.get("c.fetchsObjectDetails");
"recId" : component.get("v.recordId")
let state = response.getState();
if(state == 'SUCCESS'){
let result = response.getReturnValue();
console.log('Result returned: '+result);
console.log('Something went wrong!');


/* Name:copyToClipboardCntrl
* Description: This Apex class retrieve the sObject details such as Name, record link from database.
* Created Date: 01/05/2019
* LastModified Date:01/05/2019
* Created By: Arun Kumar
* Version: 1.0
public class copyToClipboardCntrl {
public static wrapperCls fetchsObjectDetails(Id recId){
string sObjectTypeName = recId.getSObjectType().getDescribe().getName();
SObject record = Database.query('Select Id, Name From ' + sObjectTypeName + ' Where Id = :recId');
system.debug('Record = '+record);
String iconName;
String recordURL;
string sObjectName = sObjectTypeName;
List<Schema.DescribeTabSetResult> tabDescList = Schema.describeTabs();
List<Schema.DescribeTabResult> tabDescResult = new List<Schema.DescribeTabResult>();
List<Schema.DescribeIconResult> iconDescResult = new List<Schema.DescribeIconResult>();
for(Schema.DescribeTabSetResult tdl : tabDescList) { tabDescResult.addAll(tdl.getTabs()); }
for(Schema.DescribeTabResult tdr : tabDescResult) {
if( sObjectName == tdr.getSobjectName() ) {
if( tdr.isCustom() == true ) {
} else {
iconName = 'standard:'+sObjectName.toLowerCase();
for (Schema.DescribeIconResult idr : iconDescResult) {
if (idr.getContentType() == 'image/svg+xml'){
iconName = 'custom:' + idr.getUrl().substringBetween('custom/','.svg').substringBefore('_');
system.debug('Tab Icon Name'+ iconName);
String urlInstance = String.valueof(System.URL.getSalesforceBaseURL().gethost());
String s2 = urlInstance.removeEndIgnoreCase('.my.salesforce.com');
String finalURL = 'https://'+s2+&#39;.lightning.force.com/lightning/r/'+sObjectTypeName+'/'+recId+'/view';
String fieldValue = (String) record.get('Name');
system.debug('Record: ' +fieldValue);
wrapperCls wObject = new wrapperCls(fieldValue,finalURL,iconName);
return wObject;
public class wrapperCls{
public String sObjectName;
public String recUrlLink;
public String iconName;
public wrapperCls(string sObjectName,String recUrlLink,String iconName){
this.sObjectName = sObjectName;
this.recUrlLink = recUrlLink;
this.iconName = iconName;
view raw copyToClipboardCntrl hosted with ❤ by GitHub

Happy Coding…! 