Toastr JS keep toasts visible indefinitely

Question

I'm attempting to show a toast message using the Toastr plugin from John Papa. (http://codeseven.github.io/toastr/demo.html) I'm having trouble finding an option to have the toasts remain on screen indefinitely without manually setting the "timeOut" and "extendedTimeOut" values to something absurdly high. Does anyone know of a way to do this?

toastr.options = {
    "closeButton": true,
    "timeOut": "500000",
    "extendedTimeOut": "100000"
}
toastr.error('Error!');

score 18 · Accepted Answer · answered Mar 14 '16 at 14:28

18

Based on the code, set them to 0

timeOut: 5000, // Set timeOut and extendedTimeout to 0 to make it sticky

answered Mar 14 '16 at 14:28

FrEaKmAn

1,785
1
21
47

2

In addition I had to set "extendedTimeOut": 0 as well. – Strabek Jun 24 '20 at 09:10
This worked for me with bootstrap 4 but with bootstrap 5, the options don't work properly. I set 0 for timeOut and for extendedTimeOut, but the toast still closes after a short-while. – Avner Moshkovitz Jan 27 '23 at 08:22
You confirmed that it also works with version 5 - https://stackoverflow.com/questions/75242712/toastr-options-not-working-with-bootstrap-5 – FrEaKmAn Jan 29 '23 at 14:25

score 1 · Answer 2 · answered Nov 09 '22 at 10:24

1

To display toast until user closes, set disableTimeOut and closeButton

        toastr.error("Message", "Title", { disableTimeOut: true, closeButton:true });

answered Nov 09 '22 at 10:24

Simon H

508
1
5
18

Does this work if bootstrap 5 is also used ? – Avner Moshkovitz Jan 27 '23 at 08:23

Toastr JS keep toasts visible indefinitely

2 Answers2