How to assign ID to toastr.js notification and update it as needed

Question

In my project I need to keep notification open unless user clicks on it and if there is an update in the time between it was triggerred and the user clicks on it, i need to update the value on the toast notificaiton.

I don't find any reference on how can i update a notification. Does anyone know ?

i'm using this github repo : toastr.js

please suggest

Answer 1

You can keep the toast open indefinitely by setting a timeOut value of 0 on the global scope using toast.options.

Alternately, you can set it using the third argument of the toast method.

For example:

toastr.success("message body", "title", {timeOut:0})

For your second question, you can update an existing toast by capturing it's reference when it's created, and then mutating it after creation.

For example:

var myToast = toastr.success("message body", "title", {timeOut:0});
myToast.find(".toast-title").text("new title");
myToast.find(".toast-message").text("new message");

You may also want to set the extendedTimeOut to 0 too, in case the user hovers over the toast before you've finished with it, like so:

var myToast = toastr.success("message body", "title", {timeOut:0, extendedTimeOut:0});

Then when you're done you can hide the toast programmatically:

$(myToast).fadeOut();