Making enter/return in text input have same effect as button

[Brian Marick]

(Disclaimer: I didn’t come to Elm knowing Javascript.)

Anyone know of a source for code that sends a message when the user presses enter in a particular text input field? I could write the code - eventually - but it looks to be awfully fiddly and something that a zillion people must have done already. 

—— 

To be specific:

I have the following controls on a page. When the `Add` button is clicked, it causes a new tag to appear in the list of tags. I want Enter to do the same thing.

That is, I think I need code to put in what is currently this:

        input [ class "input"

              , type' "text"

              , value (tentativeTag animal)

              , Events.onInput (SetTentativeTag animal.id)

              , .. call magic event function here ...

              ]

[Matthew Bray]

Take a look at onEnter from elm-todomvc:

https://github.com/evancz/elm-todomvc/blob/master/Todo.elm#L237

--
You received this message because you are subscribed to the Google Groups "Elm Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elm-discuss...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Brian Marick]

Thank you! Am I right in thinking than this way (shown below) is more idiomatic than using a form and a true submit button?

              [ p [class "control"]

                  [ input [

                          ...

                          , Events.onInput (SetTentativeTag animal.id)

                          , onEnter (CreateNewTag animal.id)

                          ] []

                  ]

               , a [ class "button is-success is-small"

                   , onClickWithoutPropagation (CreateNewTag animal.id)

                   ]

                  [ text "Add" ]

              ])

On Dec 4, 2016, at 4:54 AM, Matthew Bray <matt...@gmail.com> wrote:

Take a look at onEnter from elm-todomvc:

https://github.com/evancz/elm-todomvc/blob/master/Todo.elm#L237

On Sat, 3 Dec 2016, 22:11 Brian Marick, <mar...@exampler.com> wrote:

(Disclaimer: I didn’t come to Elm knowing Javascript.)

Anyone know of a source for code that sends a message when the user presses enter in a particular text input field? I could write the code - eventually - but it looks to be awfully fiddly and something that a zillion people must have done already. 

—— 

To be specific:

I have the following controls on a page. When the `Add` button is clicked, it causes a new tag to appear in the list of tags. I want Enter to do the same thing.

<Screen Shot 2016-12-03 at 3.17.29 PM.png>

That is, I think I need code to put in what is currently this:

        input [ class "input"

              , type' "text"

              , value (tentativeTag animal)

              , Events.onInput (SetTentativeTag animal.id)

              , .. call magic event function here ...

              ]

--
You received this message because you are subscribed to the Google Groups "Elm Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elm-discuss...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.