Insert a success message after Location.Reload()

Question

I would like to add a successfully edited message via JS after reloading the page. The message is displayed before reloading the page and not before.

Follows my code:

Call AJAX:

var resposta = $.ajax({
            url: url,
            method: 'POST',
            contentType: 'application/json',
            data: JSON.stringify(
                    {
                        id: idProjeto,
                        nome: nomeProjeto,
                        resumo: resumoProjeto,
                        dataInicio: dataInicioProjeto,
                        dataFim: dataFimProjeto
                    }
                ),
            error: onErroSalvandoProjeto.bind(this),
            success: onProjetoSalvo.bind(this)
        });

These are my duties:

function onProjetoSalvo(){
  
    location.reload();
    insertPrimaryAlert();
}

    function insertPrimaryAlert(){
        var alertPrimary = '<div class="alert alert-info"> Projeto editado com sucesso! </div>';
        document.getElementById('alertas').innerHTML = alertPrimary;
    }

Answer 1

For this the page needs to store a state if the project has been saved successfully, unfortunately while reloading the page you wipe all the data from your application. What you can do is save if the request was successfully made on browser storage, and, when reloading, check that the stored value is as true.

/**
 * Salva os dados para o armazenamento local
 * do navegador
 */
function saveSuccessfullRequestToLocalStorage() {
  localStorage.setItem("_success", true);
}

/**
 * Apaga os dados salvos no armazenamento local
 * do navegador
 */
function clearSuccessfullRequest() {
  localStorage.removeItem("_sucessfull");
}

/**
 * Confere se a requisição foi feita com sucesso
 * insere o alerta e limpa os dados do armazenamento
 * local
 */
function checkSuccessfullRequest() {
  const successfullRequest = localStorage.getItem("_success");

  if (successfullRequest) {
    insertPrimaryAlert();
    clearSuccessfullRequest();
  }
}