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 <[email protected]>:
>>>
>>>> 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 [email protected].
For more options, visit https://groups.google.com/d/optout.
