Elm - prevent default with subscriptions

Question

subscriptions : Model -> Sub Action
subscriptions model =
  let
    modalKeyUp m n = case n of
      13 -> Modal m Accept
      27 -> Modal m Close
      _  -> Modal m NoModalAction
    modalSub = case model.showModal of
      NoModal -> Sub.none
      m -> Keyboard.ups (modalKeyUp m)
  in
    modalSub

Context: I am trying to develop a textarea editor (like the one in this page that allows you to insert links and images via modal window).

Problem: If i click Enter when one of the inputs inside any of the modal windows is focused, the formulary will submit. I would know how to solve it if this happened to be an onClick event handler (using onWithOptions). But i do not know how to solve it when using subscriptions.

Ok, just as i finished writing the question, i've realised that i can add event handlers to the inputs with "keyup" preventDefault — RamiroPastor
Please add an answer to your own question with enough info for others, or alternatively remove the question altogether, if you think it's not applicable to common knowledge and helpful for others. Otherwise this question is just left hanging as an "orphan". Thanks. — kaskelotti

RamiroPastor RamiroPastor · Accepted Answer · 2018-07-01T20:01:49

E.onWithOptions
    "keydown"
    {stopPropagation = True, preventDefault = True}
    (succeed NoOp)

This prevents the implicit form submission when added to an input (must be "keydown" because that's when the browser executes the implicit submission)

Edit1: Also prevents writing anything in the input. Gosh

Edit2: Finally solved this issue using the form attribute to bind these inputs to a nonexistent formulary: A.form ""

Elm - prevent default with subscriptions

1 Answers