force-showToast - lightning-msg

force:showToast Message Display In Multiple Lines In Salesforce Lightning Component

Lightning Component

Hello guys, today in this post i am going to share a workaround for salesforce lightning force:showToast event to display toast message in multiple lines.

In javaScript string we can use /n escape characters for insert a newline in string. so i have used /n in ‘force:showToast’ event message(string type) attribute, like following code in lightning component javaScript controller :

but still getting no result. 🙁  [display in single line]

single-line toast

 

 

This event is handled by the one.app container. It’s supported in Lightning Experience, Salesforce app, and Lightning communities.

Solution/Workaround :

create a external CSS file with following code :

next upload this CSS file in static resource and reference in your lightning component using ltng:require tag.

Check Also : Alternate/Workaround for contains() function in aura:if Condition in Lightning Component
JavaScript Controller :

multiline-toast-lightning

 

Happy Learning 🙂

Related Resource :

showToast Doc

 

(Visited 6,557 times, 4 visits today)

6 comments

  • Hi,

    I have a requirement. I have an account object and Custom Account object, a field called Segment in Account, If I fill this picklist field then the value will auto populate from Account to custom Account using a formula. now when I am creating a custom account field I need to show a validation error saying that field is not populated using lightning component and apex controller. please help me

  • Thank you man I needed changing some styles in the toast. And your article was spot on. But would you elaborate why it works with a static resource and not with just adding it to the component CSS

Leave a Reply