Skip to content

Commit 82cf824

Browse files
authored
Wordsmithing
Replaced "a <input>" with "an <input>" in a couple of places. Simplified wording slightly to (hopefully) be easier for non-native speakers to read.
1 parent 436c43e commit 82cf824

File tree

1 file changed

+4
-4
lines changed

1 file changed

+4
-4
lines changed

Diff for: content/docs/forms.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -191,20 +191,20 @@ Overall, this makes it so that `<input type="text">`, `<textarea>`, and `<select
191191
>```
192192
## The file input Tag
193193
194-
In HTML, a `<input type="file">` lets the user choose one or more files from their device's storage, allowing the app to handle them as per the use case.
194+
In HTML, an `<input type="file">` lets the user choose one or more files from their device storage to be uploaded to a server or manipulated by JavaScript via the [File API](https://developer.mozilla.org/en-US/docs/Web/API/File/Using_files_from_web_applications).
195195
196196
```html
197197
<input type="file" />
198198
```
199199
200-
In React, a `<input type="file" />` works similarly to a normal `<input/>` with some major differences. The `<input type="file" />` in React is read-only and hence setting the value of a file programmatically is impossible. You can use the various File management API provided by Javascript to handle the files that are uploaded by the user.
200+
In React, an `<input type="file" />` works similarly to a normal `<input/>` with one important difference: **it is read-only**. (You can't set the value programmatically.) Instead, you should use the File API to interact with the files.
201+
202+
The following example shows how a `ref` can be used to access file(s) in a submit handler:
201203

202204
`embed:forms/input-type-file.js`
203205

204206
[Try it on CodePen](codepen://forms/input-type-file)
205207

206-
Note how a `ref` to the file input is used to access the file(s) in the submit handler
207-
208208
## Handling Multiple Inputs
209209

210210
When you need to handle multiple controlled `input` elements, you can add a `name` attribute to each element and let the handler function choose what to do based on the value of `event.target.name`.

0 commit comments

Comments
 (0)