Popup using Salesforce Lightning Component

Popup using Salesforce Lightning Component

The below code will open Contacts tab when the popup is closed.

Sample Code:

Lightning Component:

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >  
         
    <section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" aria-modal="true" aria-describedby="modal-content-id-1" class="slds-modal slds-fade-in-open">  
          
        <div class="slds-modal__container">  
              
            <!-- Modal/Popup Box Header-->  
            <header class="slds-modal__header">  
                <lightning:buttonIcon iconName="utility:close"  
                                      onclick="{! c.closeModel }"  
                                      alternativeText="close"  
                                      variant="bare-inverse"  
                                      class="slds-modal__close"/>  
                <h2 id="modal-heading-01" class="slds-text-heading_medium slds-hyphenate">Header</h2>  
            </header>  
            <!--Modal/Popup Box Body-->  
            <div class="slds-modal__content slds-p-around_medium" id="modal-content-id-1">  
                Sample Body  
            </div>  
            <!--Modal/Popup Box Footer-->  
            <footer class="slds-modal__footer">Footer</footer>  
              
        </div>  
          
    </section>  
      
</aura:component>

Lightning Component Controller:

({  
    closeModel : function(component, event, helper) {  
          
        var homeEvent = $A.get("e.force:navigateToObjectHome");  
        homeEvent.setParams({  
            "scope": "Contact"  
        });  
        homeEvent.fire();  
          
    }  
}) 

Output:

Leave a Reply