Thursday, September 10, 2020

 

Quick Send Email Lightning Component

Quick Email Send lightning component looks like :

 

Send Email Lightning Component

In Gmail.

Send Email Lightning Component

apex class [ EmailSendController.apxc]

  • see code comments.

component [EmailSend.cmp]

  • We divided our lightning component in 4 parts. 
  • In the Part 1 : we declare 4 aura:attribute for store values on component.
  • In the Part 2: we declare simply our component Header
  • In the Part 3 : we are declare Popup model for show the ‘successful’ message after send a Email with the close button. in this part we are using aura:if component for conditionally renders the message Popup model. by default we make it hide(false).
  • In the Part 4 : we are created a form with 3 fields and a button to get input from user and send a Email.

controller [ EmailSendController.js]

  • When we click on the Send Button sendMail function will be fire .
  • In this sendMail function first we get all 3 fields value [Email, Subject, Mail Body] and store these value in variable.
  • after store value we  check if the Email field is Empty or not contains “@” ,so display a alert message otherwise  call and pass the fields values to helper function.
  • Second function closeMessage fire when user click on close  button on  “message popup modal”, and hide the message box body[Part 3 ] from the component by set the mailStatus attribute to false.

Helper  [EmailSendHelper.js]

  •   In the Helper function, we are call the server side apex method and set the 3 parameter  to this sendMailMethod method.
  • When the server response comes and response state is “SUCCESS” then display the success message box by set the mailStatus attribute to true. .

TestApp.app


No comments:

Post a Comment