New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Dismissable alerts #158
Dismissable alerts #158
Conversation
Looks great! |
I just noticed that 'dismissable' only works if you give the alert an id. Seems like an unnecessary burden to have to give an id to an Alert that will never get used on the server. Only needed to hide it on the client, right? Just for future reference and those who are really lazy (not me of course!), I wonder, is this a quirk about Dash not being able to propagate events to id-less components? Anyway, maybe just a mention in the docs will help the next person, too. Anyway, awesome update! :) |
Hey @jchang10, Thanks a lot for raising this. I haven't been able to reproduce it though. This is the test app I ran: import dash
import dash_bootstrap_components as dbc
app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
app.layout = dbc.Alert("This is an alert", dismissable=True)
if __name__ == "__main__":
app.run_server(debug=True, port=8888) The Alert dismissed as I would have expected when clicking on the dismiss button. These are the versions of Dash libraries I was using:
Could you share an example where you see the behaviour you describe? |
Yes, exact same versions, but I am still seeing the same problem. The only difference with my test is this line. Change: IE, add a Div wrapper or even a dbc.Card, etc. If I add an id to Alert, it works, tho. |
@jchang10 I managed to reproduce it, thanks. Also, that is very weird! I'll try to figure out what the problem is. I'm going to make an issue for this for visibility. |
This PR adds a
dismissable
prop toAlert
which, when set toTrue
, adds a dismiss button to the alert. It can be used alongside the existingis_open
prop to display or dismiss alerts. See the following screenshot:I have also taken the opportunity to improve the alert documentation, and add some more detailed examples.