How to control text inside Form.Input (like grabbing and clearing after submit)?

[zarnihpyoe]

I don't see any props and example of controlling text inside Form.Input in the documentation . It'd be great if there's an example in documentation.

[levithomason]

Vanilla React input

<input value='I am read only' />
<input defaultValue='I am editable' />

Semantic UI React Input

<Input value='I am read only' />
<Input defaultValue='I am editable' />

Shorthand Form.Input

<Form.Input value='I am read only' />
<Form.Input defaultValue='I am editable' />

[levithomason]

Because our components are inline with vanilla React behavior, you can refer to React's docs for more info on how to work with Forms:

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

[zarnihpyoe]

Thanks levi. That helps a lot.

[levithomason]

I'm adding detailed usage examples for both these cases as well. You can see them here for now:

https://github.com/Semantic-Org/Semantic-UI-React/pull/1521/files

[filipetedim]

As per this issue here: Semantic-Org/Semantic-UI#1870 , the default option where you can't edit values should not appear as editable, as it may confuse users.