榆树:提交时的清晰表格

时间:2016-10-17 20:26:18

标签: elm

我有一个带有一个字段的简单表单。我想在表单提交上清除该字段。我在更新功能中清除了我的模型,但文本仍保留在文本输入中。

type alias Model =
    { currentSpelling : String }

type Msg
    = MorePlease

update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        MorePlease ->
            (  log "cleared spelling: " { model | currentSpelling = "" }
                , fetchWord model.currentSpelling )

view : Model -> Html Msg
view model =
    div []
        [ Html.form [ onSubmit MorePlease ]
            [ input [ type' "text"
                    , placeholder "Search for your word here"
                    , onInput NewSpelling
                    , attribute "autofocus" ""
                    ] []
            , text model.currentSpelling
            , input [ type' "submit" ] [ text "submit!" ]
            ]
        ]

当我使用更新功能清空时text显示model.currentSpelling,但文本输入框仍然填充。知道如何清除它吗?

fetchWord进行HTTP调用,但此处省略了。

1 个答案:

答案 0 :(得分:11)

value model.currentSpelling添加到。的属性中 输入元素。这就是你如何控制字符串 在html中输入元素的内部。