# Form Decoding: the next era of the Form Validation

**URL:** <https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560>\
**Category:** Show and Tell\
**Created:** [April 26, 2019, 12:06pm UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560 "2019-04-26T12:06:29Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![arowM](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/arowm/32/4999_2.png) [@arowM](https://discourse.elm-lang.org/u/arowM)\
**Post date:** [April 26, 2019, 12:06pm UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/1 "2019-04-26T12:06:29Z")

</div>

I’ve published a [post about **form decoding**](https://arow.info/posts/2019/form-decoding/), a sort of form validation especially suitable for statically typed languages like Elm, and released form decoding library [elm-form-decoder](https://github.com/arowM/elm-form-decoder).

---

<div class="post-metadata">

**Author:** ![ilias](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/ilias/32/6_2.png) [@ilias](https://discourse.elm-lang.org/u/ilias)\
**Post date:** [April 26, 2019, 5:14pm UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/2 "2019-04-26T17:14:51Z")

</div>

This is pretty cool!

It reminds me quite a bit of `stoeffel/elm-verify` which is conceptually similar: turn one datastructure into another, while collecting errors when things go wrong.

Nice work 👍

---

<div class="post-metadata">

**Author:** ![arowM](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/arowm/32/4999_2.png) [@arowM](https://discourse.elm-lang.org/u/arowM)\
**Post date:** [April 27, 2019, 4:18am UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/3 "2019-04-27T04:18:04Z")

</div>

Thanks very much for reading and also valuable information.  
I’ll add “Related work” section on package README, and reffer it.

---

<div class="post-metadata">

**Author:** ![unsoundscapes](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/unsoundscapes/32/410_2.png) [@unsoundscapes](https://discourse.elm-lang.org/u/unsoundscapes)\
**Post date:** [April 28, 2019, 5:52am UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/4 "2019-04-28T05:52:19Z")

</div>

This looks great! I wonder if it is possible to validate fields independently of each other. What would the model look like?

My use case is validating a field as soon as the focus leaves the input.

---

<div class="post-metadata">

**Author:** ![arowM](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/arowm/32/4999_2.png) [@arowM](https://discourse.elm-lang.org/u/arowM)\
**Post date:** [April 28, 2019, 9:49am UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/5 "2019-04-28T09:49:06Z")

</div>

Thanks for interested in.  
Is your use case differ from my [real world example](https://arowm.github.io/elm-form-decoder/)?  
(It shows error immediately if you input some invalid value like “foo” in age field and leave focus.)

---

<div class="post-metadata">

**Author:** ![unsoundscapes](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/unsoundscapes/32/410_2.png) [@unsoundscapes](https://discourse.elm-lang.org/u/unsoundscapes)\
**Post date:** [April 28, 2019, 11:37am UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/6 "2019-04-28T11:37:58Z")

</div>

Oh! It actually works as expected. Somehow I switched the focus without typing anything into the field, and expected an error because the field was required. Then I assumed that there was no validation on blur.

---

<div class="post-metadata">

**Author:** ![arowM](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.elm-lang.org/arowm/32/4999_2.png) [@arowM](https://discourse.elm-lang.org/u/arowM)\
**Post date:** [April 28, 2019, 1:49pm UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/7 "2019-04-28T13:49:51Z")

</div>

Okay, so only you have to do is just running decoders for fields:

```elm
ageError : RegistrationForm -> Html msg
ageError form =
  div [class "error-field"]
    <| List.map (\err -> p [class "error-text"] [text err]) <| Decoder.errors age_ form

```

FYI, my sample form does not warn till pressing register button for EFO, but you could warn required field when blur by handling blur event.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex035/uploads/elm_lang/original/1X/50a05e53677a2c3b47776d7abd0f113eb50193a1.png) [@system](https://discourse.elm-lang.org/u/system)\
**Post date:** [May 8, 2019, 1:59pm UTC](https://discourse.elm-lang.org/t/form-decoding-the-next-era-of-the-form-validation/3560/8 "2019-05-08T13:59:05Z")

</div>

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.