Good afternoon, I understand this may seem like a duplicate question but I believe it is not. Please enlighten me since I'm new to lightning. I'm trying to get my JS buttons to work in lightning without much success. The first approach I tried was by creating a lightning component. It works perfectly except for the fact that instead of having the button on the top right it appears in the Feed area. Code for this solution: Component

<aura:component implements="force:lightningQuickAction,force:hasRecordId" controller="ApexController">
<!-- Attribute -->
<aura:attribute name="loading" type="Boolean" default="true" />
<!-- Event handlers -->
<aura:handler name="init" action="{!c.myAction}" value="{!this}" />
<!-- Lightning design system "spinner" + loading message -->
<aura:if isTrue="{!v.loading}">
<div class="slds-spinner_container">
<div class="slds-spinner slds-spinner-brand slds-spinner-medium" role="status">
<div class="slds-spinner__dot-a"></div>
<div class="slds-spinner__dot-b"></div>
<!-- /Spinner -->

Js Controller

myAction : function(component, event, helper) {
var action = component.get("c.assignToCurrentUser"); // method on ApexController.cls
// v.recordId does not have to be explicitly defined as an attribute.
// this is taken care of the force:hasRecordId implementation
var params = {"recordId": component.get("v.recordId")};
action.setCallback(this, function(response) {
var state = response.getState();
component.set("v.loading", false);
if (component.isValid() && state === "SUCCESS")
helper.helperMethod("success", "Case assignment", "Case has been assigned to you!");
// Show "toast" -> nice message dialog
helper.helperMethod("error", "Case assignment", "The system was unable to assign the case to you. Please contact your salesforce administrator");
// automatically close dialog -> so no user action needed

Js Helper

helperMethod : function(toasttype, title, message, data) {
data = data || [];
var toastEvent = $A.get("e.force:showToast");
type: toasttype,
mode: "sticky",
title: title,
message: message,
messageTemplate: message,
messageTemplateData: data

Apex controller

public class ApexController {
public static Boolean assignToCurrentUser(Id recordId)
    Case caseObj=new Case();
    caseObj.Id = recordId; 
    caseObj.OwnerId = UserInfo.getUserId();
    update caseObj;
    return true;

In Case > Buttons, Links and actions > click New Action Action Type: Lightning component Lightning Component: The one created above After it is created add it to the page layout in the salesforce 1 and lightning area

The second solution looks like the one I've seen in convert Javascript button to VF page button but my top priority was to get it to work with lightning components instead

  • I guess when you use a Visualforce page using lightning out to expose a component, toast doesn't work. – Raul Sep 25 '17 at 12:27
  • It does work. The problem with the visualforce page with the lightning component in it is the refresh. I mentioned the toasts for the second solution, which does not use the lightning components, it is just a visualforce page with js – Irina Clington Sep 25 '17 at 14:35

The reason the button is appearing in the feed area instead of the top right actions is related to the fact that this quick action was created for a case. It looks fine for leads, for example. This means the first solution works according to the specifications and is a valid one. I'll change the component to show a button and add it anywhere I like in the record page instead.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.