Search code examples
javascriptjqueryajaxtoastr

Reload page after notify shows completely done


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"
    }
}

Solution

  • 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(); }
        }
    }