Skip to content

Commit b977656

Browse files
committed
correcciones de @joaquinelio y @maksumi
1 parent 951179b commit b977656

1 file changed

Lines changed: 13 additions & 13 deletions

File tree

5-network/02-formdata/article.md

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11

22
# FormData
33

4-
Éste capítulo se trata del envío de formularios HTML: con o sin archivos, con campos adicionales y cosas similares.
4+
Éste capítulo trata sobre el envío de formularios HTML: con o sin archivos, con campos adicionales y cosas similares.
55

66
Los objetos [FormData](https://xhr.spec.whatwg.org/#interface-formdata) pueden ser de ayuda en esta tarea. Tal como habrás supuesto, éste es el objeto encargado de representar los datos de los formularios HTML.
77

@@ -14,18 +14,18 @@ Si se le brinda un elemento HTML `form`, el objeto automáticamente capturará s
1414

1515
Lo que hace especial al objeto `FormData` es que los métodos de red, tales como `fetch`, pueden aceptar un objeto `FormData` como el cuerpo. Es codificado y enviado como `Content-Type: multipart/form-data`.
1616

17-
Desde el punto de vista del servidor, se como una entrega normal.
17+
Desde el punto de vista del servidor, se ve como una entrega normal.
1818

19-
## Enviando un simple formulario
19+
## Enviando un formulario simple
2020

2121
Enviemos un formulario simple.
2222

2323
Tal como se puede ver, es prácticamente una línea:
2424

2525
```html run autorun
2626
<form id="formElem">
27-
<input type="text" name="nombre" value="John">
28-
<input type="text" name="apellido" value="Smith">
27+
<input type="text" name="name" value="John">
28+
<input type="text" name="surname" value="Smith">
2929
<input type="submit">
3030
</form>
3131

@@ -55,13 +55,13 @@ Contamos con métodos para poder modificar los campos del `FormData`:
5555

5656
- `formData.append(name, value)` - agrega un campo al formulario con el nombre `name` y el valor `value`,
5757
- `formData.append(name, blob, fileName)` - agrega un campo tal como si se tratara de un `<input type="file">`, el tercer argumento `fileName` establece el nombre del archivo (no el nombre del campo), tal como si se tratara del nombre del archivo en el sistema de archivos del usuario,
58-
- `formData.delete(name)` - remove el campo de nombre `name`,
58+
- `formData.delete(name)` - elimina el campo de nombre `name`,
5959
- `formData.get(name)` - obtiene el valor del campo con el nombre `name`,
60-
- `formData.has(name)` - en caso de que exista el campo con el nombre `name`, retorna `true`, de lo contrario `false`
60+
- `formData.has(name)` - en caso de que exista el campo con el nombre `name`, devuelve `true`, de lo contrario `false`
6161

6262
Un formulario técnicamente tiene permitido contar con muchos campos con el mismo atributo `name`, por lo que múltiples llamadas a `append` agregarán más campos con el mismo nombre.
6363

64-
Por otra parte existe un método `set`, con la misma sintáxis que `append`. La diferencia está en que `.set` remueve todos los campos con el `name` que se le ha pasado, y luego agrega el nuevo campo. De este modo nos aseguramos de que sólo un campo éxiste con determinado `name`, el resto es tal cómo en `append`:
64+
Por otra parte existe un método `set`, con la misma sintáxis que `append`. La diferencia está en que `.set` remueve todos los campos con el `name` que se le ha pasado, y luego agrega el nuevo campo. De este modo nos aseguramos de que sólo un campo éxiste con determinado `name`, el resto es tal como en `append`:
6565

6666
- `formData.set(name, value)`,
6767
- `formData.set(name, blob, fileName)`.
@@ -112,7 +112,7 @@ Aquí un ejemplo con un formulario de éste tipo:
112112

113113
## Enviando un formulario con datos Blob
114114

115-
Tal como pudimos ver en el capítulo <info:fetch>, es fácil enviar datos binarios generados dinámicamente ej. una imagen, como `Blob`. Podemos simplemente proporcionarla a `fetch` como un parametro en el `body`.
115+
Tal como pudimos ver en el capítulo <info:fetch>, es fácil enviar datos binarios generados dinámicamente (por ejemplo una imagen) como `Blob`. Podemos proporcionarlos directamente en un `fetch` con el parámetro `body`.
116116

117117
De todos modos en la práctica, suele ser conveniente enviar la imagen como parte del formulario junto a otra meta data tal como el nombre y no de forma separada.
118118

@@ -154,21 +154,21 @@ Este ejemplo envía una imagen desde un `<canvas>`, junto con algunos campos má
154154
</body>
155155
```
156156

157-
Note como la imagen `Blob` es agregada:
157+
Nota como la imagen `Blob` es agregada:
158158

159159
```js
160160
formData.append("image", imageBlob, "image.png");
161161
```
162162

163-
Se obtiene el mismo resultado tal como si se tuviese un campo `<input type="file" name="image">` en el formulario, y el usuario enviara un archivo con nombre `"image.png"` (3er argumento) con los datos `imageBlob` (2do argumento) desde su sistema de archivos.
163+
Es lo mismo que si hubiera un campo `<input type="file" name="image">` en el formulario, y el usuario enviara un archivo con nombre `"image.png"` (3er argumento) con los datos `imageBlob` (2do argumento) desde su sistema de archivos.
164164

165165
El servidor lee el formulario `form-data` y el archivo tal como si de un formulario regular se tratara.
166166

167167
## Resumen
168168

169-
[FormData](https://xhr.spec.whatwg.org/#interface-formdata) objetos utilizados para capturar un formulario HTML y enviarlo utilizando `fetch` u otro método de red.
169+
Los objetos [FormData](https://xhr.spec.whatwg.org/#interface-formdata) son utilizados para capturar un formulario HTML y enviarlo utilizando `fetch` u otro método de red.
170170

171-
Podemos de este modo utilizar `new FormData(form)` tal que from es un elemento formulario HTML, o crear un objeto sin un formulario en absoluto, y agregar los campos con los siguientes métodos:
171+
Podemos crear el objeto con `new FormData(form)` desde un formulario HTML, o crearlo sin un formulario en absoluto, y agregar los campos con los siguientes métodos:
172172

173173
- `formData.append(nombre, valor)`
174174
- `formData.append(nombre, blob, nombreDeArchivo)`

0 commit comments

Comments
 (0)