# Click event delegation to avoid page link

**URL:** <https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843>\
**Category:** Ask us anything\
**Tags:** binding\
**Created:** [March 29, 2024, 9:55am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843 "2024-03-29T09:55:41Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![LivingStoneHgS](https://avatars.discourse-cdn.com/v4/letter/l/439d5e/32.png) [@LivingStoneHgS](https://community.weweb.io/u/LivingStoneHgS)\
**Post date:** [March 29, 2024, 9:55am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843/1 "2024-03-29T09:55:42Z")

</div>

Hi,

I have a parent container (more precisely, a custom component) to which I attributed a “Link” to “Page”. Now into this parent, I also have a specific button to show a contextual menu. So naturally when I click on this child, I’m redirected to the page given by the parent because I actually clicked on it…

But how can I overwrite the action to operate, not to go on page, but just change my showContextMenu variable ? That is to say, I want to be redirected to the page if I click on this component, except if I click on the button ?

I searched a bit around adding a event.preventDefault() on page load, but nothing conclusive, maybe I did it wrong (see on screenshot).

I hope this question can help others.

Thanks !

![Screenshot 2024-03-29 at 10.54.16](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/4/45477b28e2c6fceaf497025ad2050ecef23fa8ea.png)

---

<div class="post-metadata">

**Author:** ![jptrinh](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/jptrinh/32/1493_2.png) [@jptrinh](https://community.weweb.io/u/jptrinh)\
**Post date:** [March 29, 2024, 10:15am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843/2 "2024-03-29T10:15:04Z")

</div>

Hey!

You are on the right track! You have an action Stop click propagation that you need to add at the beginning of your workflow.  
 ![CleanShot 2024-03-29 at 11.13.27](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/4/44a218aa3aba8e6b239b2e0a40351ff9bb96c4b3.png)

---

<div class="post-metadata">

**Author:** ![LivingStoneHgS](https://avatars.discourse-cdn.com/v4/letter/l/439d5e/32.png) [@LivingStoneHgS](https://community.weweb.io/u/LivingStoneHgS)\
**Post date:** [March 30, 2024, 11:16am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843/3 "2024-03-30T11:16:53Z")

</div>

Indeed… I was not conscious of the feature… thanks !!

---

<div class="post-metadata">

**Author:** ![SilasCG](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@SilasCG](https://community.weweb.io/u/SilasCG)\
**Post date:** [July 18, 2024, 3:17am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843/4 "2024-07-18T03:17:43Z")

</div>

Hey, i used “Stop click propagration”, but it seems that it works only sometimes, when i spam click my Link it will still redirect me, any idea how to fix that?

---

<div class="post-metadata">

**Author:** ![jptrinh](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/jptrinh/32/1493_2.png) [@jptrinh](https://community.weweb.io/u/jptrinh)\
**Post date:** [July 19, 2024, 5:41am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843/5 "2024-07-19T05:41:19Z")

</div>

Hey @SilasCG  
Can you share a video/screenshot of how things are built on your situation?

---

<div class="post-metadata">

**Author:** ![SilasCG](https://avatars.discourse-cdn.com/v4/letter/s/7feea3/32.png) [@SilasCG](https://community.weweb.io/u/SilasCG)\
**Post date:** [November 27, 2024, 1:28am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843/6 "2024-11-27T01:28:19Z")

</div>

Hello,

I forgot the previous answer, but I’ve encountered the issue again. Please find attached some screenshots of my situation. Thank you!

 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/e/edb23bff1d065d5075c24a287d9a3e5706799288.png)

 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/3/375e083a88f85264010feb10cf84c0012ceed27d.png)

---

<div class="post-metadata">

**Author:** ![jptrinh](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/jptrinh/32/1493_2.png) [@jptrinh](https://community.weweb.io/u/jptrinh)\
**Post date:** [November 27, 2024, 10:27am UTC](https://community.weweb.io/t/click-event-delegation-to-avoid-page-link/7843/7 "2024-11-27T10:27:10Z")

</div>

Hey @SilasCG 🙂  
I think some context would help. How is the parent of your element configured? Can you make a quick video showing all of that?
