Handling multiple "On click" events in blocks

Hi,

I have one block with multiple elements in the block. See this example where I use alerts instead of moving to other pages. The parent block shows an alert on an “On Click” event. Three elements “Picture, Text, and the Right arrow icon” have no “On Click” event and therefore follow the blocks “On Click” event". The “Edit” (pen icon) has its own action/alert for its “On Click” event. When I click on “Picture, Text or Right Arrow, or any white space” I get one alert which comes from the parent block “On Click”. This is the correct experience as it captures the user clicking anywhere in the block. If I click on the “Edit” icon I want a different action. However I get two alerts (actions) which comes from the “On Click” of the Edit icon as well as the “On Click” of the parent block.

Is there a way to have elements in a block only execute their “On Click” event and not then goto the parent block “On Click” event as well. If not I’m just wandering what is the most efficient way to structure blocks that have multiple elements with multiple “On Click” events, while still ensuring that if the user clicks anywhere in the block (all white space included) the appriopriate “On click event” will be executed.

Appreciate thoughts on this… thanks.

Hello @Glenn_D

I have created an internal ticket BKNDLSS-29338 to have a possibility to not propagating the event

Hello @Glenn_D

We have added a new “Stop propagation for” block. Use this block for child blocks events to stop propagation.

Regards,
Inna

1 Like

Hi @Inna_Shkolnaya and @sergey.kuk

Thank you to the backendless team for looking into the issue and providing a fix. I just tested the new “stop propagation” function and it works really well. The change makes the flow of event logic easier to manage and reduces the need for breaking up the UI into multiple blocks to handle different parent/child events.

The support that the backendless team provides is fantastic!

Thank you
Glenn

1 Like