0

Tenho um ajax que exclui uma imagem, após a exclusão, gostaria que a página desse um reload e mostrasse uma mensagem de "Excluído com Sucesso!" com alert boostratp. Já pesquisei nos fóruns e não achei anda que me ajudasse.

jQuery(document).ready(function() { 
    jQuery('#teste').submit(function(){
        var dados = jQuery( this ).serialize();

        $.ajax({
            type: 'POST',
            dataType: 'json',
            url: "crud/excluirImagem.php",
            data: dados,
                success: function(data) {
                    location.reload();
            }
        });

    });

});

Alerta bootstrap

Uma solução

 jQuery(document).ready(function() { 
    jQuery('#teste').submit(function(){
    var dados = jQuery( this ).serialize();

 $.ajax({
    type: 'POST',
    dataType: 'json',
        url: "crud/excluirImagem.php",
        data: dados,
        success: function(data) {
        $('.alert').fadeIn('2000');
            setTimeout(function(){ reloadPagina() }, 3000);

            }
        });
        return false;
    });
});

function reloadPagina() {
    location.reload();
}

2 Respostas 2

1

Você pode tentar fazer o seguinte:

  • Criar a função de excluir a imagem!
  • No AJAX, você não precisa dar reload (tente fazer sem reload)!
  • Dentro do .success ou .done tente fazer com que apareça o alert usando as funções fadeIn('slow'); e fadeOut('slow');
  • Após dar fadeOut, é só dar o reload na página, simples! Qualquer dúvida é só perguntar!

Exemplo

$.ajax ({
        type: 'POST',
        dataType: 'json',
        url: "crud/excluirImagem.php",
        data: dados,
            success: function(data) {
                $('#alert').fadeIn('2000');
                //Intervalo
                $('#alert').fadeOut('5000');
        }
    });
0

Não precisa de reload.

html

<div id="alert" class="alert alert-success" role="alert"></div>

JavaScript

$(function () {
 $("#alert").css('display', 'none');
 $('#teste').submit(function(){
   var dados = jQuery( this ).serialize();  
   $.ajax({
     type: 'POST',
     dataType: 'json',
     url: "crud/excluirImagem.php",
     data: dados,
     success: function(data) {
       $("#alert").css('display', 'block');
       $("#alert").html('sua_msg_aqui!');
     }
   });
 });
});

Tb tem o alert-dismissible. Dá uma olhada nos docs do bootstrap.

6
  • Sou obrigado a dar reload, para "sumir" as imagens que acabarem de ser excluídas. 25/09/2016 às 0:35
  • 1
    Basta criar a alert na mesma página, e depois colocar um intervalo de 10 segundos ou menos, aí, só dar o reload! 25/09/2016 às 0:37
  • 1
    @Alisson você também pode apagar as imagens com .remove() ou .hide() no success do ajax... 25/09/2016 às 0:49
  • @jader-a-wagner deu a dica 25/09/2016 às 0:49
  • Uma solução foi a encontra na pergunta que editei, o que acham? 25/09/2016 às 1:00

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .