[SalesForce] Lightning component Quick Action – Hide Modal

Does anyone know how to remove the standard modal from the quick action ?

I tried to put that line in the init method but with no success:

$A.get("e.force:closeQuickAction").fire();

Any idea?

My Controller:

    ({
    doInit : function(component, event, helper) {

        $A.get("e.force:closeQuickAction").fire();

        var action = component.get("c.getRecordTypeId");
        action.setParams({
            accountId : component.get("v.recordId")
        });
        action.setCallback(this, function(response){
            var state = response.getState();
            if(state === "SUCCESS"){
                var recordTypeId = response.getReturnValue();

                var createRecordEvent = $A.get("e.force:createRecord");
                createRecordEvent.setParams({
                    "entityApiName": "Opportunity",
                    "recordTypeId" : recordTypeId,
                    "defaultFieldValues": {
                        'AccountId' : component.get("v.recordId")
                    }
                });
                createRecordEvent.fire();
            } else if(state === "ERROR"){
                console.log('Error: ' + JSON.stringify(response.error));
            } else {
                console.log('Unknown problem, state: '+ state + ', error: ' + JSON.stringify(response.error));
            }
        });

        $A.enqueueAction(action);
    }
})

Best Answer

What you all need is implement one interface in component i.e. force:lightningQuickActionWithoutHeader.

Components that implement the force:lightningQuickActionWithoutHeader interface display in a panel without additional controls and are expected to provide a complete user interface for the action.

When used as actions, components that implement the force:lightningQuickAction interface display in a panel with standard action controls, such as a Cancel button. These components can also display and implement their own controls but should be prepared for events from the standard controls.

And in your controller, you can use this var dismissActionPanel = $A.get("e.force:closeQuickAction"); dismissActionPanel.fire();

({
    doInit : function(component, event, helper) {
        var action = component.get("c.cloneOpportunity");
        var opp = component.get("v.recordId");
        action.setParams({
                "OppId" : component.get("v.recordId")
                });
        action.setCallback(this,function(data){
           var clonedRecordId = data.getReturnValue();        
             helper.navigate(component);
            var dismissActionPanel = $A.get("e.force:closeQuickAction");
             dismissActionPanel.fire();

        });
 $A.enqueueAction(action);
 }
})

Note:-

When used as actions, components that implement the force:lightningQuickAction interface display in a panel with standard action controls, such as a Cancel button. These components can also display and implement their own controls, but should be prepared for events from the standard controls.

Components that implement the force:lightningQuickActionWithoutHeader interface display in a panel without additional controls and are expected to provide a complete user interface for the action.

These interfaces are mutually exclusive. That is, components can implement either the force:lightningQuickAction interface or the force:lightningQuickActionWithoutHeader interface, but not both. This should make sense; a component can’t both present standard user interface elements and not present standard user interface elements.

Reference:-

  1. https://releasenotes.docs.salesforce.com/en-us/winter17/release-notes/rn_lightning_component_actions.htm
  2. https://developer.salesforce.com/docs/atlas.en-us.204.0.lightning.meta/lightning/components_using_lex_s1_config_action.htm

Update:-

try this:- you were using $A.get("e.force:closeQuickAction") not on the right place

({
    doInit : function(component, event, helper) {

        var action = component.get("c.getRecordTypeId");
        action.setParams({
            accountId : component.get("v.recordId")
        });
        action.setCallback(this, function(response){
            var state = response.getState();
            if(state === "SUCCESS"){
                var recordTypeId = response.getReturnValue();
                helper.navigate(component);
                var dismissActionPanel = $A.get("e.force:closeQuickAction");
                dismissActionPanel.fire();
            }
            else if(state === "ERROR"){
                console.log('Error: ' + JSON.stringify(response.error));
            }
                else {
                console.log('Unknown problem, state: '+ state + ', error: ' + JSON.stringify(response.error));
            }
        });

        $A.enqueueAction(action);
    }
})

Helper class:-

({
    navigate : function(component, optyId) {
        var createRecordEvent = $A.get("e.force:createRecord");
        createRecordEvent.setParams({
            "recordId": component.get("v.recordId"),
            "entityApiName": "Opportunity",
            "defaultFieldValues": {
                'AccountId' : component.get("v.recordId")
            }
        });      
        createRecordEvent.fire();
    }
})
Related Topic