Do we need to manage the state of radio buttons in Elm? - elm

Question

I am referring to this example in http://elm-lang.org/examples/radio-buttons. I don't see anywhere whereby the state of the buttons is being managed.
In my own little Elm project I need to do something like
label []
[ input
[ type_ "radio"
, checked (model.choosenSize == size)
, onClick (SetSize size)
] []
, text (sizeToString size)
]
Without managing the checked attribute, all the radio buttons will remain checked after you click on it.
So what is the magic in the example?

Answer 1

The example you are referring is very simple. It doesn't explicitly manage the state of the buttons. Instead, their state is managed by the browser. In a real application, of course, you would better manage it explicitly. Something like:
view : Model -> Html Msg
view model =
div []
[ fieldset []
[ radio "Small" (model.fontSize == Small) (SwitchTo Small)
, radio "Medium" (model.fontSize == Medium) (SwitchTo Medium)
, radio "Large" (model.fontSize == Large) (SwitchTo Large)
]
, Markdown.toHtml [ sizeToStyle model.fontSize ] model.content
]
radio : String -> Bool -> msg -> Html msg
radio value isChecked msg =
label
[ style [("padding", "20px")]
]
[ input [ type_ "radio", checked isChecked, name "font-size", onClick msg ] []
, text value
]
(I added a Bool argument to radio)