Thanks Marco, here is the corrected version:

*import Html exposing (text, div, input, button, p, span)*
*import Html.App exposing (beginnerProgram)*
*import Html.Attributes exposing (..)*
*import Html.Events exposing (onInput, onClick)*


*main =*
*    beginnerProgram*
*        { model = { state = WaitingForSubmit, inputStr = "", 
submittedValue = "" }*
*        , update = update*
*        , view = view*
*        }*



*-- MODEL*


*type alias Model =*
*    { state : State*
*    , inputStr : String*
*    , submittedValue : String*
*    }*


*type State*
*    = WaitingForSubmit*
*    | WaitingForConfirm*



*-- UPDATE*


*type Msg*
*    = NewContent String*
*    | Submit*
*    | Cancel*
*    | Confirm*


*update msg model =*
*    case msg of*
*        NewContent str ->*
*            { model | inputStr = str }*

*        Submit ->*
*            { model | state = WaitingForConfirm }*

*        Cancel ->*
*            { model | state = WaitingForSubmit }*

*        Confirm ->*
*            { model*
*                | state = WaitingForSubmit*
*                , inputStr = ""*
*                , submittedValue = model.inputStr*
*            }*



*-- VIEW*


*view { state, inputStr, submittedValue } =*
*    div []*
*        [ input [ onInput NewContent, value inputStr ] []*
*        , case state of*
*            WaitingForSubmit ->*
*                span []*
*                    [ button [ disabled (inputStr == ""), onClick Submit ] 
[ text "Submit" ] ]*

*            WaitingForConfirm ->*
*                span []*
*                    [ button [ onClick Cancel ] [ text "Cancel" ]*
*                    , button [ onClick Confirm ] [ text "Confirm" ]*
*                    ]*
*        , p [] [ text ("Submitted value: " ++ submittedValue) ]*
*        ]*

On Thursday, October 20, 2016 at 3:49:49 PM UTC+2, Marco Perone wrote:
>
> you could just add a `value` to your input field like
>
>     input [ onInput NewContent, value inputStr ]
>
> and then reset the `inputStr` value when you confirm the submission
>
>     Confirm ->
>             { model
>                 | state = WaitingForSubmit
>                 , inputStr = ""
>                 , submittedValue = model.inputStr
>             }
>
> On Thursday, October 20, 2016 at 2:57:54 PM UTC+2, Erkal Selman wrote:
>>
>> You can paste the following into http://elm-lang.org/try :
>>
>>
>> *import Html exposing (text, div, input, button, p, span)*
>> *import Html.App exposing (beginnerProgram)*
>> *import Html.Attributes exposing (..)*
>> *import Html.Events exposing (onInput, onClick)*
>>
>>
>> *main =*
>> *    beginnerProgram*
>> *        { model = { state = WaitingForSubmit, inputStr = "", 
>> submittedValue = "" }*
>> *        , update = update*
>> *        , view = view*
>> *        }*
>>
>>
>>
>> *-- MODEL*
>>
>>
>> *type alias Model =*
>> *    { state : State*
>> *    , inputStr : String*
>> *    , submittedValue : String*
>> *    }*
>>
>>
>> *type State*
>> *    = WaitingForSubmit*
>> *    | WaitingForConfirm*
>>
>>
>>
>> *-- UPDATE*
>>
>>
>> *type Msg*
>> *    = NewContent String*
>> *    | Submit*
>> *    | Cancel*
>> *    | Confirm*
>>
>>
>> *update msg model =*
>> *    case msg of*
>> *        NewContent str ->*
>> *            { model | inputStr = str }*
>>
>> *        Submit ->*
>> *            { model | state = WaitingForConfirm }*
>>
>> *        Cancel ->*
>> *            { model | state = WaitingForSubmit }*
>>
>> *        Confirm ->*
>> *            { model*
>> *                | state = WaitingForSubmit*
>> *                , submittedValue = model.inputStr*
>> *            }*
>>
>>
>>
>> *-- VIEW*
>>
>>
>> *view { state, inputStr, submittedValue } =*
>> *    div []*
>> *        [ input [ onInput NewContent ] []*
>> *        , case state of*
>> *            WaitingForSubmit ->*
>> *                span []*
>> *                    [ button [ disabled (inputStr == ""), onClick Submit 
>> ]*
>> *                        [ text "Submit" ]*
>> *                    ]*
>>
>> *            WaitingForConfirm ->*
>> *                span []*
>> *                    [ button [ onClick Cancel ] [ text "Cancel" ]*
>> *                    , button [ onClick Confirm ] [ text "Confirm" ]*
>> *                    ]*
>> *        , p [] [ text ("Submitted value: " ++ submittedValue) ]*
>> *        ]*
>>
>> A question: Is there a way to clear the input field (on confirm) without 
>> using ports?
>>
>> On Thursday, October 20, 2016 at 12:48:40 PM UTC+2, António Ramos wrote:
>>>
>>>
>>> http://blog.krawaller.se/posts/composition-in-cyclejs-choo-react-and-angular2/
>>>
>>> 2016-10-20 11:48 GMT+01:00 António Ramos <ramst...@gmail.com>:
>>>
>>>> can anyone dare to code the same app in elm?
>>>>
>>>> http://blog.krawaller.se/posts/composition-in-cyclejs-choo-react-and-angular2/~
>>>> i would like to see it and learn from you guys because i just "hate" 
>>>> javascript...
>>>>
>>>> Regards
>>>> António
>>>>
>>>
>>>

-- 
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+unsubscr...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to