Question about <ha-alert>

Configuration Frontend
1

Hi I am running the latest version of HA and I am trying the following in a card but it does not seem to work or I am doing something wrong

type: markdown
content: |
<ha-alert alert-type="success">
  This is an success alert ā€” check it out!
  <mwc-button slot="action" label="Undo"></mwc-button>
</ha-alert>

or even

type: markdown
content: |
<ha-alert alert-type="success" dismissable>
  This is an success alert ā€” check it out!
</ha-alert>

When I run them I get something like the following but not action

image

but I am not able to get any action. According to the

https://design.home-assistant.io/#components/ha-alert

it should have worked or perhaps I am doing something wrong. Can someone clarify things up and provide any help.

Thanks

Phanos

2

What action did you expect?

All it does is display a message, which it is doing.

3

Hi tom_i,

in

https://design.home-assistant.io/#components/ha-alert

is says that you can get a button to have some action

image
image1013Ɨ363 32.5 KB

see Undo at the end of the message?

Maybe I did not understand something here correctly? Please let me know.

Phanos

4

Did I misunderstood what the documentation says or I make something wrong?

5

ā€‹Iā€™m also looking for a solution. I hope the documentation on the website will be continued soon. This would be a nice, simple solution to click away the messages or flip a switch, if it works as i understood it.

6

That documentation is for front-end developers, for the card I lay a small subset of html elements are allowed, and even if more where allowed like mwc-button, you would not be able to attach a JavaScript handler to the action.

Only the base functions of ha-alert is exposed (type/title/content)

2 Likes