Don't have an account?
Search for an answer or ask a question of the zone or Customer Support.
You need to sign in to do that
Sign in to start searching questions
Signup for a Developer Edition
Sign in to start a discussion
The below blog might answer your query,
https://salesforce.stackexchange.com/questions/195129/show-lightning-toast-message-in-multiple-lines
https://salesforce.stackexchange.com/questions/278366/how-to-show-toast-message-in-multiple-lines-in-a-lightning-web-component
I hope you find the above solution helpful. If it does, please mark as Best Answer to help others too.
Thanks.
Hope this helps!
Prady01
we have to override CSS :
1) Create a CSS file and add in static resource
File Content :
.toastMessage{
white-space: break-spaces !important;
}
2) Import That static resource file in your component
import { loadStyle } from 'lightning/platformResourceLoader';
import CUSTOMCSS from '@salesforce/resourceUrl/{yourfileName}'
a) Define variable like : isCssLoaded = false;
3) Call it in reRenderCallback
renderedCallback(){
if(this.isCssLoaded) return
this.isCssLoaded = true;
loadStyle(this,CUSTOMCSS).then(()=>{
console.log('loaded');
})
.catch(error=>{
console.log('error to load');
});For Multiple Lines Toast in LWC
we have to override CSS :
1) Create a CSS file and add in static resource
File Content :
.toastMessage{
white-space: break-spaces !important;
}
2) Import That static resource file in your component
import { loadStyle } from 'lightning/platformResourceLoader';
import CUSTOMCSS from '@salesforce/resourceUrl/{yourfileName}';
a) Define variable like : isCssLoaded = false;
3) Call it in reRenderCallback
renderedCallback(){
if(this.isCssLoaded) return
this.isCssLoaded = true;
loadStyle(this,CUSTOMCSS).then(()=>{
console.log('loaded');
})
.catch(error=>{
console.log('error to load');
});
}
4)Create your toast message like this
var msg = 'This is first-line \nThis is Second Line. \nThis is third Line.';
const evt = new ShowToastEvent({
title: "Complete Required Fields :",
message: msg,
variant: "error",
});
this.dispatchEvent(evt);
}
4)Create your toast message like this
var msg = 'This is first line \nThis is Second Line. \nThis is third Line.';
const evt = new ShowToastEvent({
title: "Complete Required Fields :",
message: msg,
variant: "error",
});
this.dispatchEvent(evt);