# Update functions getting called twice with one click event
**URL:** https://discourse.elm-lang.org/t/update-functions-getting-called-twice-with-one-click-event/7399
**Category:** Learn
**Created:** [May 27, 2021, 7:31am UTC](https://discourse.elm-lang.org/t/update-functions-getting-called-twice-with-one-click-event/7399 "2021-05-27T07:31:39Z")
**Posts on this page:** 5
**Page:** 1
### Author:  [@saurabh](https://discourse.elm-lang.org/u/saurabh)
#### Post date: [May 27, 2021, 7:31am UTC](https://discourse.elm-lang.org/t/update-functions-getting-called-twice-with-one-click-event/7399/1 "2021-05-27T07:31:39Z")
I am trying to implement a simple dropdown using elm-ui. I am following this medium article [https://medium.com/nerd-for-tech/elm-elm-ui-and-the-building-of-a-dropdown-part-i-8aff2ed079b2](https://medium.com/nerd-for-tech/elm-elm-ui-and-the-building-of-a-dropdown-part-i-8aff2ed079b2) .
The UI consist of one text input element. The dropdown options are rendered by Element.Column and using the Element.below attribute to the input element. There are 3 msg NoAction/ClickedSelectFood/ClickedDropdownFood. When user click on input element ClickSelectFood is triggered. When user clicks on one of the dropdown element ClickedDropdownFood is triggered.
Update function:
\> update : Msg → Model → Model
> ```
> update msg model =
> case msg of
> NoAction ->
> model
> ClickedSelectFood ->
> let
> a = Debug.log "Inside ClickedSelectFood" msg
> in
> { model | status = SelectFood }
> ClickedDropdownFood ->
> let
> a = Debug.log "Inside ClickedDropdownFood" msg
> in
> { model | status = Normal}
>
> ```
Problem is whenever one of the elements of the dropdown is clicked: the update function is called twice. Once with ClickedDropdownFood msg and once with ClickedSelectFood message. But the view code is only called once. My understanding was that Elm always renders the UI with every update call.
I suspect the issue might be that I am using Element.below to render the dropdown options. Maybe two events are generated by the click.
Any ideas ?
Ellie link: [https://ellie-app.com/dhy7yMfMr9Ba1](https://ellie-app.com/dhy7yMfMr9Ba1)
---
### Author:  [@rupert](https://discourse.elm-lang.org/u/rupert)
#### Post date: [May 27, 2021, 8:31am UTC](https://discourse.elm-lang.org/t/update-functions-getting-called-twice-with-one-click-event/7399/2 "2021-05-27T08:31:13Z")
> [@saurabh](#):
>
> My understanding was that Elm always renders the UI with every update call.
Usually the `view` is called once per animation frame. The `update` can be called many times within that cycle.
> [@saurabh](#):
>
> I suspect the issue might be that I am using Element.below to render the dropdown options. Maybe two events are generated by the click.
I think the `onClick` event is propagating up the DOM. You have 2 `onClick` event handlers in the code, perhaps you only need 1? Or perhaps you need to stop the inner one from propagating using the options available here: [VirtualDom - virtual-dom 1.0.3](https://package.elm-lang.org/packages/elm/virtual-dom/latest/VirtualDom#Handler)
---
### Author:  [@saurabh](https://discourse.elm-lang.org/u/saurabh)
#### Post date: [May 27, 2021, 9:34am UTC](https://discourse.elm-lang.org/t/update-functions-getting-called-twice-with-one-click-event/7399/3 "2021-05-27T09:34:04Z")
Thanks for the response Rupert. Looks like elm-ui Events does not expose functionality to stop event propagation. Should I use use virtual-dom event handler ?
---
### Author:  [@nil](https://discourse.elm-lang.org/u/nil)
#### Post date: [May 27, 2021, 10:43am UTC](https://discourse.elm-lang.org/t/update-functions-getting-called-twice-with-one-click-event/7399/4 "2021-05-27T10:43:43Z")
You could conditionally enable the click handler on the Dropdown.
```
([ Border.width 1
, Border.dashed
, E.padding 3
] ++ case model.status of
SelectFood ->
[E.below (E.column [](List.map viewFood foodList))]
Normal->
[Events.onClick ClickedSelectFood, -- I moved the onClick to the non-selecting state only.
E.below E.none])
```
Something like this: [https://ellie-app.com/dhDFVv6XSLha1](https://ellie-app.com/dhDFVv6XSLha1) . I also wired up the event to select a fruit 🙂
---
### Author:  [@system](https://discourse.elm-lang.org/u/system)
#### Post date: [June 6, 2021, 10:44am UTC](https://discourse.elm-lang.org/t/update-functions-getting-called-twice-with-one-click-event/7399/5 "2021-06-06T10:44:17Z")
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.