# Clickable inner elements triggering elements outer elements

**URL:** <https://community.weweb.io/t/clickable-inner-elements-triggering-elements-outer-elements/2598>\
**Category:** How do I?\
**Tags:** design\
**Created:** [May 4, 2023, 8:41pm UTC](https://community.weweb.io/t/clickable-inner-elements-triggering-elements-outer-elements/2598 "2023-05-04T20:41:19Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![mauromequelussi](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/mauromequelussi/32/10223_2.png) [@mauromequelussi](https://community.weweb.io/u/mauromequelussi)\
**Post date:** [May 4, 2023, 8:41pm UTC](https://community.weweb.io/t/clickable-inner-elements-triggering-elements-outer-elements/2598/1 "2023-05-04T20:41:19Z")

</div>

How can I prevent clickable elements inside an example card from triggering the click event of the parent element, as is happening in the video below.

In other words, I want when I click on the card it opens the popup and when I click on the icon, it fires the onclick event only for the icon and not for the card. In the video example, it is shooting from both, when I click on the internal element that has another workflow…

---

<div class="post-metadata">

**Author:** ![mauromequelussi](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/mauromequelussi/32/10223_2.png) [@mauromequelussi](https://community.weweb.io/u/mauromequelussi)\
**Post date:** [May 4, 2023, 9:40pm UTC](https://community.weweb.io/t/clickable-inner-elements-triggering-elements-outer-elements/2598/2 "2023-05-04T21:40:11Z")

</div>

![Captura de Tela 2023-05-04 às 18.36.06](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/6/6847115e0bfeeb52670b71f9ff6558546f9f427d.png)

I managed using the html attribute, as shown in the image (outline in red).

This prevents the event from being propagated to parent elements.

I don’t know if this is the best solution, but it would be interesting for the WeWeb team to natively implement this.

---

<div class="post-metadata">

**Author:** ![dorilama](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/dorilama/32/10403_2.png) [@dorilama](https://community.weweb.io/u/dorilama)\
**Post date:** [May 4, 2023, 9:44pm UTC](https://community.weweb.io/t/clickable-inner-elements-triggering-elements-outer-elements/2598/3 "2023-05-04T21:44:16Z")

</div>

the event is also available in the workflow You can use `stopPropagation` directly with a javascript action in the workflow.  
I’m not at my desktop but if I recall correctly you should look for the `domEvent` property inside the provided event object.

---

<div class="post-metadata">

**Author:** ![Quentin](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/quentin/32/6_2.png) [@Quentin](https://community.weweb.io/u/Quentin)\
**Post date:** [May 5, 2023, 4:05pm UTC](https://community.weweb.io/t/clickable-inner-elements-triggering-elements-outer-elements/2598/4 "2023-05-05T16:05:48Z")

</div>

I’ll add it to our roadmap, so that we create a workflow action for this!