JS Button To Lightning
JS Button To Lightning
We have been using JavaScript buttons for years in Salesforce Classic to fulfill several business requirements.But, JS buttons are not supported in salesforce lightning. So, we are in need to migrate from Javascript buttons.
How to Solve?
Migrate the JS buttons to lightning quick actions/buttons with custom lightning components or VF pages. We suggested to go with lightning component unless list view buttons.
Lightning Buttons:
Lightning is based on the LockerService Framework and aims at providing the most robust security model possible. Thus, as a result, OnClick JavaScript buttons are not supported. Quick actions can be used to replace buttons that populate a new record with values based on the values in the record where a user clicks the button.
JavaScript code for Button
{!REQUIRESCRIPT("/soap/ajax/25.0/connection.js")}
if({!ISBLANK( Case.Account)}){
alert('Account Name is blank for requested Case');
} else{
var win = window.open('http://localhost:9159/contract_enquiry/{! Case.Account }', 'Account Redirect' ,"width=600, height=550, scrollbars=yes");
setTimeout(function () { win.close();}, 6000);
}
Lightning Component Converted from JS
<aura:component implements="force:lightningQuickActionWithoutHeader,forceCommunity:availableForAllPageTypes,force:hasRecordId" controller="JSButtontoLightningController" access="global">
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<div class="slds-card slds-card_boundary">
<p>Validating...</p>
<lightning:spinner alternativeText="Loading" size="small" aura:id="spinner" />
</div>
</aura:component>
Make sure to use force:lightningQuickActionWithoutHeader interface to utilize the component as quick action.
({
doInit : function(component, event, helper) {
var action = component.get("c.getValues");
action.setParams({
"caseID" : component.get("v.recordId")
});
action.setCallback(this, function(response){
var state=response.getState();
if(state=="SUCCESS"){
var accountName=response.getReturnValue();
console.log(accountName);
if(accountName == null)
{
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
"message": "Account Name is blank for requested case","type": "Error"
});
toastEvent.fire();
}
else
{
var myWindow=window.open ("http://localhost.9159/item_enquiry/"+accountName,
"mywindow","menubar=1,resizable=1,width=600,height=550");
window.setTimeout(
$A.getCallback(function() {
myWindow.close(component, helper)
}), 6000
);
}
}
else if (state === "INCOMPLETE") {
var errors = response.getError();
if (errors) {
if (errors[0] && errors[0].message) {
console.log("Error message: " +
errors[0].message);
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
"type": "error",
"message": errors[0].message
});
toastEvent.fire();
}
}
} else if (state === "ERROR") {
var errors = response.getError();
if (errors) {
if (errors[0] && errors[0].message) {
console.log("Error message: " +
errors[0].message);
var toastEvent = $A.get("e.force:showToast");
toastEvent.setParams({
"type": "error",
"message": errors[0].message
});
toastEvent.fire();
}
} else {
console.log("Unknown error");
}
}
$A.get("e.force:closeQuickAction").fire();
});
$A.enqueueAction(action);
}
})
public class JSButtontoLighningController {
//This method is used to get Account Name
@AuraEnabled
public static String getValues(Id caseID)
{
LIST caseList= [SELECT Id,Account.Name FROM Case where Id =:caseID ];
return caseList[0].Account.Name;
}
}
More to Know
We are Inno Valley Works , We are a passionate team of developers, best thinkers and consultants who can solve anything and everything.
With our highly engaging team, you can easily bring the vision to all your business ventures come true.
We have team, put your problem, get your solution
.