Giter VIP home page Giter VIP logo

elm-validation's Introduction

elm-validation

Tools for managing validity and error state of data, e.g. from user input.

To install

$ elm install ericgj/elm-validation

Example

Basic usage for validation in an HTML form.

view : Form -> Html Msg
view form =
    div []
        [ input
            [ type_ "text"
            , value
                (form.input
                    |> Validation.toString identity
                )
            , onInput
                (Validation.validate isRequired
                    >> SetInput
                )
            ]
            []
        , div 
            [ class "error" ]
            [ text
                (Validation.message form.input
                    |> Maybe.withDefault ""
                )
            ]
        ]

Combining validation of form fields to determine overall validity of a model. (For example, this could be used to determine if the submit button should be enabled on the form.)

validateForm : Form -> ValidationResult Model
validateForm form =
    Validation.valid Model
        |> Validation.andMap form.field1
        |> Validation.andMap form.field2

See the Elm package for full usage docs.

elm-validation's People

Contributors

ericgj avatar owanturist avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

elm-validation's Issues

Support validation on blur or submit?

Hi,

I generally like the approach, but I feel that Initial should also contain a payload of type String. This would store the user's input while the user is first typing, but before validation occurs.

I assume validation should occur on blur or on submit, since it's considered bad user experience to show, say, "Invalid email" as soon as the user has entered the first character in an email field.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.