Não estou conseguindo executar o código do evento "closed.bs.alert".
Ou seja, executar um código após a total remoção de um trecho de código disparado quando se clica no botão Close do Alert no Bootstrap.
HTML:
<button id="btn_add">
Add
</button>
<div id="result">
<div class="col-md-12 alert">
<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>
<div class="panel panel-default"><div class="panel-heading">0 [fixed]</div>
</div>
</div>
SCRIPT:
$(document).ready(function(){
var count = 1;
$("#btn_add").click(function(){
var str = '<div class="col-md-12 alert">'+
'<a href="#" class="close" data-dismiss="alert" aria-label="close">×</a>'+
'<div class="panel panel-default"><div class="panel-heading">'+count+' [dynamic]</div>'+
'</div>';
$("#result").html($("#result").html()+str);
count++;
});
$(".alert").on('closed.bs.alert', function(){
alert('The alert message is now closed.');
});
});
Código disponível aqui, no jsfiddle.
No caso, o Bootstrap Alert fixo funciona, mas o dinâmico não. Ou seja, nos alertas criados dinamicamente eu não consigo executar o código do evento "closed.bs.alert".
Deve ser algo simples que não tô conseguindo resolver, talvez deveria implementar algo com This ou criar Ids únicos para cada alerta dinâmico que se cria.
Obs: após criar um alerta dinâmico o alerta fixo também deixar de funcionar para o evento "closed.bs.alert".