[SalesForce] Call Custom Object Quick Action from Lightning Component

We're in transition from classic to lightning and are working to update several of our javascript buttons over into lightning components, quick actions, etc.

I have one javascript button that calls a visualforce page that launches a flow. If I convert this over to a quick action, I like how it displays as a model popup within the page instead of opening in a new tab. My beef is the placement of the action as it's collapsed where the standard buttons show.

enter image description here

To help keep these visible, I have created a custom button panel (lightning component) to highlight some of our most frequently used custom actions. My challenge is that I'm having trouble calling that quick action from my custom button panel.

Here's my Custom Object Action:
enter image description here

Here's my component code:

    <aura:component implements="flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickActionWithoutHeader,lightning:isUrlAddressable" >
    <lightning:workspaceAPI aura:id="workspace"/>
    <lightning:quickActionAPI aura:id="quickActionAPI"/>

    <!--Used to store data within an aura component-->
    <aura:attribute name="helpTicket" type="Object"/>
    <aura:attribute name="helpTicketRecord" type="Help_Ticket__c" default="{'sObjectType': 'Account'}"/> 

    <force:recordData aura:Id="recordData" recordId="{!v.recordId}" fields="['Account__c', 'OwnerId']"
                      targetRecord="{!v.helpTicket}" targetFields="{!v.helpTicketRecord}" mode="EDIT"/>

    <div>
        <lightning:button variant="brand" class="paylocity-orange" label="Accept" onclick="{!c.acceptHelpTicket}"/>
        <lightning:button variant="brand" class="paylocity-orange" label="Close Help Ticket" onclick="{!c.closeHelpTicket}"/>        
    </div>
</aura:component>

Here's the controller code I thought for sure would work:

closeHelpTicket : function(component, event, helper) {        
    var actionAPI = component.find("quickActionAPI");
    var fields = {Id: {value: component.get("v.recordId")}};
    var args = {actionName: "Help_Ticket__c.Close_Help_Ticket_3", entityName: "Help_Ticket__c", targetFields: fields};
    actionAPI.setActionFieldValues(args).then(function(result) {
        actionAPI.invokeAction(args);
        console.log('closeHelpTicket action called');
        //Action selected; show data and set field values
    }).catch(function(e) {
        if(e.errors) {
            console.log(e.errors);
        }
    });
}

Here's what I'm seeing from the console after I click the button from the console component.
enter image description here

What am I missing?

Best Answer

You can't call a quick action if you don't have that Quick Action added to the page -layout.

You have to put that quickAction on the page -layout for the quickActionAPI to open it.

Src: How to fire global action from a Lightning Component

Related Topic