Dynamic click event

Wappler General Need Help
1

There is the following code:

<div class="d-flex flex-column" dmx-on:click="modal_delete_message.show()">
  <button id="btn" class="btn" dmx-on:click="var_updating.setValue(222)">Btn</button>
</div>

The flex container has dimensions, say 300*300 pixels. Is it possible to somehow simply achieve in the Wappler that when the button is pressed, the dynamic action of the container does not work? I know how to achieve this with ordinary JS, but I would prefer to use the Wappler solution, if there is one.

2

You can use an inline flow for that on div click.
Check the variable value and if not equal to 222 then show modal.

3

Thank you for your help Teodor. But I don’t quite understand the logic, can you explain? The variable with the value 222 is given only as an example, any other dynamic event can be on the button when clicked, for example, the opening of another modal window.

4

I’ll clarify. I understood the logic. But it is not completely universal and will only work with a variable.

5

Well you can use a toggle component for this also, along with the dynamic event(s) on button click, on click toggle it.
In the flow for the div check the toggle state - if toggled, don’t run any event, if not toggled - run whatever events you need.

6

The logic is clear, but this creates excessive complexity and unreasonable congestion in the code. It is necessary to create a switch variable and monitor its state for all related events. Because of this, you can easily forget what is connected with it when the interface changes even a little. It would be very cool if in a dynamic click event it was possible to access the context of the call in order to pass get the id of the element that was clicked. Then the whole solution would be extremely simple and not requiring the creation of unnecessary, heavilywork controlled code. Something like this:

<div id="er12" class="d-flex flex-column" dmx-on:click="this.id==er12?modal_delete_message.show():null">
  <button id="btn" class="btn" dmx-on:click="this.id==btn?var_updating.setValue(222):null">Btn</button>
</div>
7

Is it possible somehow to transfer the value of the id div clicked to the inline flow that is started by clicking?

8

Perhaps using a hidden input with value= div.id… And check for the hidden input’s value