Bootstrap: Alerts not displayed once closed

[fpsanti]

I create a simple button that shows an alert-message. It pops up for the first time. Then I close it clicking on the x and it disappears. When I hit the button again the alert does not come up anymore.

You can find the source code of my example that reproduces the error at this Gist git://gist.github.com/1401006.git

I simulated this behavior because in my application it is possible that the user triggers an event that keeps throwing an error (that I'd like to notify with an alert-message) without reloading the page.

[pokonski]

It does not show up, because the alert is getting completely removed from DOM once it's hidden.

See here: https://github.com/twitter/bootstrap/blob/master/js/bootstrap-alerts.js#L75

So two choices:

1. Do not use the plugin and hide the alert by yourself

javascript $('.alert-message .close').live('click',function(){ $(this).parent().hide(); });

1. Recreate the alert from scratch in JS after it's been removed. (harder).

[fpsanti]

Thank you for your help.
Have you tried the code you suggested to hide the alert? It's not working for me.

[pokonski]

It's working fine here. http://jsfiddle.net/mNXE6/

Close the alert and then press "Show alert!" button :)

[fat]

Yep, pokonski is right! thanks

[fpsanti]

Thanks a lot!!!

[avk]

Don't forget to remove data-dismiss="alert" from existing a.close elements otherwise the alerts will still be removed.

[Sameelfm]

$(document).on('click', "button.close", function (e) { // Actually live method is absolute for latest Jquery 
        e.preventDefault();  // This is for safe if there any default behavior
        $(this).parent().hide();
    });