Lightning Aura Components – How to Show Lightning Toast on Top of Modal (Quick Action)

I have created lightning quick action to add my component for some functionality.

so from my quick action. When I do some validation like

    var opp = component.get("v.objOpportunity");
    if(!opp.Name.length || !opp.CloseDate.length )
    {
        var toastEvent = $A.get("e.force:showToast");
        toastEvent.setParams({
            "message": 'Opportunity name and close date can not be empty.',
            "type": "Error"
        });
        toastEvent.fire();
        return;
    }

So the toast message display behind the modal. Please check below screenshot.

Any solution for this issue? I don't want to write custom error message functionality to display to user.

enter image description here

Best Answer

Not an immediate answer, but the long term solution would be to indicate the known issue affects you Lightning Component force:showToast event displays toast message behind action window in Lightning Experience and Salesforce1