How to make the Toastr message appear and only then run the page report?

Question

Registration is successfully performed, but the Reload page before the Toastr message appears.

// Função formulário de cadastro de Cliente  
function cadIndCliente(btnPropToggler) {


    // Variáveis criadas para receber as informações dos inputs do formulário de cadastro do cliente
    var nome = document.getElementById("nome");
    var email = document.getElementById("email");
    var dddTelefone = document.getElementById("dddTelefone");
    var numeroTel = document.getElementById("numeroTel");
    var infoAdicional = document.getElementById("infoAdicional");

    // Armazena todas as variáveis em uma única variável
    var dados = {

        'nome': nome.value,
        'email': email.value,
        'dddTelefone': dddTelefone.value,
        'numeroTel': numeroTel.value,
        'infoAdicional': infoAdicional.value,

    }

    // Converte valores em javascript para uma String JSON
    var dadosForm = JSON.stringify(dados);

    // Envia as informações do formulário atráves de AJAX para o arquivo
    $.ajax({

        url: 'teste.php',
        type: 'POST',
        data: { data: dadosForm },

        // Retorno se tudo ocorreu normalmente
        success: function (result) {

            // codigo...

        },
        // Retorno caso algum erro ocorra
        error: function (jqXHR, textStatus, errorThrown) {

            // codigo...

        }

    });

    toastr.info('Cadastro de cliente realizado com sucesso!')

    // Após clicar no botão cadastrar imóvel da um reload na página
    sessionStorage.setItem("reloading", "true");
    document.location.reload();    

}

Answer 1

I managed to solve by applying in the setTimeout function a time of 800 Milliseconds, this way the function takes a few Milliseconds to be executed and the Toastr show its menage.

Using setTimeout() to set a range before running page Reload.

// Função formulário de cadastro de Cliente  
function cadIndCliente(btnPropToggler) {


    // Variáveis criadas para receber as informações dos inputs do formulário de cadastro do cliente
    var nome = document.getElementById("nome");
    var email = document.getElementById("email");
    var dddTelefone = document.getElementById("dddTelefone");
    var numeroTel = document.getElementById("numeroTel");
    var infoAdicional = document.getElementById("infoAdicional");

    // Armazena todas as variáveis em uma única variável
    var dados = {

        'nome': nome.value,
        'email': email.value,
        'dddTelefone': dddTelefone.value,
        'numeroTel': numeroTel.value,
        'infoAdicional': infoAdicional.value,

    }

    // Converte valores em javascript para uma String JSON
    var dadosForm = JSON.stringify(dados);

    // Envia as informações do formulário atráves de AJAX para o arquivo
    $.ajax({

        url: 'teste.php',
        type: 'POST',
        data: { data: dadosForm },

        // Retorno se tudo ocorreu normalmente
        success: function (result) {

            // codigo...

        },
        // Retorno caso algum erro ocorra
        error: function (jqXHR, textStatus, errorThrown) {

            // codigo...

        }

    });

    // Mensagem do Toast para informar que cadastro foi realizado com sucesso
    toastr.info('Cadastro de cliente realizado com sucesso!')

    // Esta função da um reload na página após 800 Milissegundo 
    window.setTimeout(function () {

        window.location.reload();

    }, 800);


}