Construir una página web con un formulario que permita agregar un producto con la siguiente información:
Nombre del producto
Precio del producto
Cantidad del producto
Categoría del producto
Luego, agregue estos datos en un array y mostrarlo en consola. Posteriormente, muestre los elementos del array en una tabla, y la última columna de esta tabla contenga unos botones con las acciones de eliminar y actualizar información del producto.
Estructura de carpetas
La estructuración cuenta con un :page_facing_up:index.html, una carpeta llamada :file_folder:CSS con un :page_facing_up:style.css y una carpeta :file_folder:script la cual contiene el JavaScript necesario para el ejercicio.
Resumen del Desarrollo
Se crearon tres funciones llamadas: datos() , mostrarDatos() , eliminar(), actualizar(), actualizarDatos().
1. datos()
Esta funcion lo que nos permite realizar obtener los datos del form y guardarlos en el array de productos
2. mostrarDatos()
Esta función nos permite mostrar los datos en un container donde se va a mostrar los datos y también mostrar en este container la lista de productos.
3. eliminar()
Esta función nos permite eliminar algún producto por el índice que es pasado a la funcion, así se eliminará un producto sin importar si son 100% iguales a los demás.
4. actualizar()
Esta funcion lo que nos permite es tomar el indice del producto que deseamos actualziar y coloca sus valores en el formulario, y crea un boton para poder actualizar los datos
5. actualizarDatos();
Esta funcion es la que finalmente nos actualiza los datos mostrados por la funcion actualizar en el formulario, tomas estos nuevos valores colocados en el form y los almacena en sus respectivas varioables para luego estos ser cambiados o actualizados en el correspondiende array.
Tabla de Productos | Productos Sprint 2 - Workshop 3
Repositorio
Descripción de Desarrollo
Construir una página web con un formulario que permita agregar un producto con la siguiente información:
Luego, agregue estos datos en un array y mostrarlo en consola. Posteriormente, muestre los elementos del array en una tabla, y la última columna de esta tabla contenga unos botones con las acciones de eliminar y actualizar información del producto.
Estructura de carpetas
La estructuración cuenta con un :page_facing_up:
index.html, una carpeta llamada :file_folder:CSScon un :page_facing_up:style.cssy una carpeta :file_folder:scriptla cual contiene el JavaScript necesario para el ejercicio.Resumen del Desarrollo
Se crearon tres funciones llamadas:
datos(),mostrarDatos(),eliminar(),actualizar(),actualizarDatos().1. datos()
Esta funcion lo que nos permite realizar obtener los datos del form y guardarlos en el array de
productos2. mostrarDatos()
Esta función nos permite mostrar los datos en un container donde se va a mostrar los datos y también mostrar en este container la lista de productos.
3. eliminar()
Esta función nos permite eliminar algún producto por el índice que es pasado a la funcion, así se eliminará un producto sin importar si son 100% iguales a los demás.
4. actualizar()
Esta funcion lo que nos permite es tomar el indice del producto que deseamos actualziar y coloca sus valores en el formulario, y crea un boton para poder actualizar los datos
5. actualizarDatos();
Esta funcion es la que finalmente nos actualiza los datos mostrados por la funcion actualizar en el formulario, tomas estos nuevos valores colocados en el form y los almacena en sus respectivas varioables para luego estos ser cambiados o actualizados en el correspondiende array.
Vistas: Desktop
Estadisticas Wakatime: