skip to Main Content

Anyone here how do I fix my notification? I want to show the notification completely done and then reload the page. Currently, my notification exits fast and not showing completely. I’m using ajax and toastr on this. Thanks so much guys! Really appreciate your help. Here’s what I’ve tried:

function InsertOrUpdateExpense() {
    var data = $('#formExpenseTransaction').serialize();
    $.ajax({
        type : 'POST',
        url : url + 'InsertOrUpdateExpenseTransaction',
        data : data,
        dataType : 'json',
        beforeSend:function() {
            $('#btn-expense--transaction').html(' <i class="icon-spinner2 spinner"></i>').attr('disabled',true);
        },
        success:function(data) {
            data.success === true ? notify(data.type,data.message) : notify(data.type,data.message);
            var content = data.type == 'info' ? 'Save Changes' : 'Add Expense';
            $('#btn-expense--transaction').html(content +' <i class="icon-arrow-right14 position-right"></i>').attr('disabled',false);
            setTimeout(function() {
                location.reload();
            }, 3000);
        }
    });
}

function notify(type,message) {
    Command: toastr[type](message)
}

function toastr_option() {
    toastr.options = {
        "newestOnTop": true, "progressBar": false, "positionClass": "toast-top-right", "preventDuplicates": true, "showDuration": 300, "hideDuration": 1000, "timeOut": 5000, "extendedTimeOut": 1000, "showEasing": "swing", "hideEasing": "linear", "showMethod": "slideDown", "hideMethod": "slideUp"
    }
}

3

Answers


  1. Just move your location.reload() from inside of setTimeout to an option of toastr, named ‘onHidden’.

    function toastr_option() {
        toastr.options = {
            "newestOnTop": true, "progressBar": false, "positionClass": "toast-top-right", "preventDuplicates": true, "showDuration": 300, "hideDuration": 1000, "timeOut": 5000, "extendedTimeOut": 1000, "showEasing": "swing", "hideEasing": "linear", "showMethod": "slideDown", "hideMethod": "slideUp", onHidden: function(){. location.reload(); }
        }
    }
    
    Login or Signup to reply.
  2. I don’t know toastr, but reading his documentation you can try with his callback functions.

    In his example: toastr.options.onHidden = function() { console.log('goodbye'); }

    Something like this:

    function toastr_option() {
        toastr.options = {
            "newestOnTop": true, "progressBar": false, "positionClass": "toast-top-right", "preventDuplicates": true, "showDuration": 300, "hideDuration": 1000, "timeOut": 5000, "extendedTimeOut": 1000, "showEasing": "swing", "hideEasing": "linear", "showMethod": "slideDown", "hideMethod": "slideUp"
        }
        toastr.options.onHidden = function() { location.reload(); }
    }
    
    Login or Signup to reply.
  3. You can Make it like this

    toastr.success(
              'Done',
              'Added Successfully',
            {
              timeOut: 1000,
              fadeOut: 1000,
              onHidden: function () {
                window.location.reload();
             }
           });
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search