I am using ajax because of the modal form, I have a toastr notification to show on the ajax success.

toastr.success("We will get back to you with response, Thanks !");

And then : window.location.reload();

How can i make it to end the notification first and then relaod. I found something but it quickly reloads the page :

$.when( toastr.success("We will get back to you with response, Thanks !") ).then(function( data, textStatus, jqXHR ) {
    window.location.reload();
});

Is there any other suitable/Best practice way ?

I am using ajax because of the modal form, I have a toastr notification to show on the ajax success.

toastr.success("We will get back to you with response, Thanks !");

And then : window.location.reload();

How can i make it to end the notification first and then relaod. I found something but it quickly reloads the page :

$.when( toastr.success("We will get back to you with response, Thanks !") ).then(function( data, textStatus, jqXHR ) {
    window.location.reload();
});

Is there any other suitable/Best practice way ?

• javascript
• jquery
• toastr

1 Answer 1

The great toastr has already a callback for the end of the hiding animation:

toastr.options.timeOut = 1000;
toastr.options.fadeOut = 1000;
toastr.options.onHidden = function(){
  // this will be executed after fadeout, i.e. 2secs after notification has been show
  window.location.reload();
};

EDIT:

You can override also just one single toast:

toastr.success(
  'Have fun!',
  'Miracle Max Says',
  {
    timeOut: 1000,
    fadeOut: 1000,
    onHidden: function () {
        window.location.reload();
      }
  }
);