20

How to display multi line error message in the toastr ??

I have formatted my error message like below

"Please fix the following: \r\nFirst Name is required\r\nLast Name is required\r\nEmail Address is required\r\n"

But in the toasrt it shows in the single line. Please help

Trilok Pathak
  • 2,931
  • 4
  • 28
  • 34
  • 3
    i believe toastr is adding the string as html tags. – Dr. Stitch Apr 28 '16 at 07:52
  • 2
    Possible duplicate of [How to put a line break into a toastr message in AngularJS?](http://stackoverflow.com/questions/31254459/how-to-put-a-line-break-into-a-toastr-message-in-angularjs) – António Ribeiro Apr 28 '16 at 08:16

5 Answers5

29

As told by Dr.Stitch , toastr using the string as html so we have to add for the new line :

Please fix the following: </br>First Name is required</br>Last Name is required</br>Email Address is required</br>

- An update: 15/12/2020:

For the version 12+ :

toastr.success('Please fix the following: </br>First Name is required</br>Last Name is required</br>Email Address is required</br>', '', { closeButton: true, timeOut: 4000, progressBar: true, allowHtml: true });

This will work !!! thank you for the help.

Trilok Pathak
  • 2,931
  • 4
  • 28
  • 34
17

allowHtml: true

toastr.success('\'Second Review\' validation has started. </br>All SME\'s and Reviewers will get an email notification', '', { closeButton: true, timeOut: 4000, progressBar: true, allowHtml: true });
David Ansermot
  • 6,052
  • 8
  • 47
  • 82
Bert
  • 171
  • 1
  • 2
15

Please note in

ng-toaster v12.1.0

it's enableHtml instead of allowHtml with <br /> as HTML.

Might also be changed in older versions.

Arslan Munir
  • 417
  • 5
  • 10
1

import toastr service first and than write your message and enable HTML

this.toastr.success('First Name is required<br />Last Name is required<br />Email Address is required<br />', { 
enableHtml: true
});
Aleksey Potapov
  • 3,683
  • 5
  • 42
  • 65
0
use '\n' in your string and add this style 

white-space : pre-line !important;

manikandan
  • 21
  • 3