5

Colegas.

Não sei se fui claro na minha dúvida, porém gostaria que o modal do Bootstrap sumisse automaticamente após a confirmação de exclusão. Por exemplo: o usuário vai excluir um produto, aparecesse a mensagem: "Produto excluído com sucesso". O modal ficasse uns 3 segundos ativo e depois desaparecesse. O código JQuery onde desejo colocar segue abaixo:

$("#produtos").on('click', 'a.remove-item', function(e) {
        e.preventDefault(); 
        var pcode = $(this).attr("codigo"); 
        $(this).parent().fadeOut(); 
        $.getJSON( "processar.php", {"remover":pcod} , function(data){ 
            $("#info").html(data.items); 
            $(".box").trigger( "click" ); 
        });
});

1 Resposta 1

5

Na documentação do Bootstrap, para esconder a modal manualmente basta chamar a função modal passando como argumento o valor hide, por exemplo: $('.minha-modal').modal('hide');.

Para executar algo após n segundos, use a função setTimeout.

$(function() {
  $('button').on('click', function() {

    // Requisição.

    $('.modal').modal('show');

    setTimeout(function() {
      $('.modal').modal('hide');
    }, 3000); // 3000 = 3 segundos
  });
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

<button>Remover Produto</button>

<div class='modal fade' role='dialog'>
  <div class='modal-dialog'>
    <div class='modal-content'>
      <div class='modal-body'>Produto Removido!</div>
    </div>
  </div>
</div>

1
  • 1
    Perfeito Renan. Muito obrigado!
    – user24136
    Commented 20/06/2016 às 2:02

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