create a Modal/Popup on click button using aura method -- w3web.net

How to display a Modal/Popup on click button using aura method in lightning component

Hey guys, today in this post we are going to learn about how to display a Modal/Popup on click button with a form inside a lightning component using aura method.

Files we used in this post example:-

modalPopupaApp.app Lightning Application It is used for call the component to preview on browser.

modalPopupParent.cmp

Lightning Component It is parent component of "childPopup.cmp".

modalPopupParentController.js

Lightning Component Controller It is used for click functionality that gets the value from child component to aura method.
childPopup.cmp Lightning Component It is a child component of "modalPopupParent.cmp" and hold aura method with action method.
childPopupController.js Lightning Component Controller It is used for display and close the Modal/Popup.

Final Output

show modal popup in lightning component -- w3web.net

Other post that would you like to learn

Step 1:- Create Lightning Application : modalPopupaApp.app

From Developer Console >> File >> New >> Lightning Application

modalPopupaApp.app [Component Application File]

Step 2:- Create Lightning Component : modalPopupParent.cmp

From Developer Console >> File >> New >> Lightning Component

modalPopupParent.cmp [Lightning Component File]

Step 3:- Create Lightning Component : modalPopupParentController.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller

modalPopupParentController.js [JavaScript Controller]

Step 4:- Create Lightning Component : childPopup.cmp

From Developer Console >> File >> New >> Lightning Component

childPopup.cmp [Lightning Component File]

Step 5:- Create Lightning Component : childPopupController.js

From Developer Console >> File >> New >> Lightning Component >> JavaScript Controller

childPopupController.js [JavaScript Controller]

Further post that you want to learn

Leave a Comment

Contribute to Support If Some Value Added in Your Project or Website