Semantic-ui-react: Clear Form After Submit

Created on 7 Dec 2016  路  1Comment  路  Source: Semantic-Org/Semantic-UI-React

This is my form

<Form onSubmit={_handleSubmit(event)}>
        <Form.Select
            label='Type'
            name='type'
            onChange={_selectChange}
            options={typeOptions}
            placeholder='Select Type' />
        <Form.Input
            label='Category'
            type='text'
            name='category'
            onBlur={_onBlur(event)}
            placeholder='Enter New Category' />
        <Form.Button>Submitting</Form.Button>
    </Form>

and my event handlers

const _handleSubmit = () => (event) => {
    event.preventDefault()
    console.log(event.target.value)
    })
}

const _selectChange = (e, { name, value }) => {
    category[name] = value
}

const _onBlur = () => (event) => {
    const val = event.target.value
    const nem = event.target.name
    if (val.trim() === '') {
        Bert.alert('New Category Name cannot be empty', 'warning')
    } else {
        category[nem] = val.trim()
    }
}

my problem is how do I clear the form after submitting it?

question

>All comments

Clear forms the same way you would in React, using "Controlled Components":

https://facebook.github.io/react/docs/forms.html#controlled-components

Was this page helpful?
0 / 5 - 0 ratings

Related issues

fuwywawyuh picture fuwywawyuh  路  24Comments

levithomason picture levithomason  路  24Comments

anhdle14 picture anhdle14  路  20Comments

layershifter picture layershifter  路  32Comments

jeffcarbs picture jeffcarbs  路  53Comments