El 14 de septiembre de 2017, publicamos una versión revisada de nuestra Política de privacidad. Tu uso continuado de video2brain.com significa que aceptas este documento revisado, por lo que te recomendamos que dediques unos minutos a leerlo y comprenderlo.

Ionic práctico: App con REST

Creación del formulario de inserción

Prueba ahora LinkedIn Learning sin cargo y sin compromiso.

Prueba gratis Mostrar modalidades de suscripción
En este capítulo vamos a aprender el modo más simple de crear formularios: añadiremos además un listado de elementos para que el formulario se maquete automáticamente y añadiremos el botón de enviar los datos.

Transcripción

La Home está practicamente lista, aunque le queda algún detalle. Ahora toca pasar a una página distinta y esta va a ser el añadir. El formulario que yo creé aquí luego lo puedo reutilizar muy fácilmente dentro de la parte de modificar datos. Voy a cambiarle el título, le voy a poner Añadir Pájaros. Y ahora dentro del Content voy a crear un IonList, aquí lo tengo, más que nada porque a mi me gustan los formularios que están creados con este Componente. Dentro de él, le añado un Ion Item, y ahora por cada elemento del formulario, por cada campo que vaya a necesitar voy a tener un IonItem distinto. Los elementos del formulario no tienen mucho truco, son Labels, así que IonLabel y luego dentro de ellos el título que casualmente es título, voy a copiarlo, voy a pegarlo, y en vez de label, también puedo utilizar los Inputs. Copio, pego... le quito ese contenido, y hasta aquí no tiene mayor problema. Voy a elegir un tipo concreto de Input de Ionic 2, que va a ser el FloatingLabel, y luego en el caso del Input le voy a pedir que sea de tipo Text. Esto mismo lo voy a repetir, y en vez del título, ahora voy a poner Pájaro. Aquí la idea es que yo cuando cree un nuevo elemento, ese va a tener el título y el pájaro que escriba el usuario, pero luego los datos de coordenadas y el número de veces los voy a generar yo automáticamente, así que en realidad va a ser un formulario muy fácil, pequeño y simple. Le voy a añadir un último elemento, pero se lo voy a añadir vacío. Esto es para dar un poquito de márgen sobre el botón del final y también para hacer que las líneas que seleccionan el que los campos sean rellenados correctamente, las que lo marcan, bueno, que tengan todas el mismo largo. Y por último, necesito también utilizar un botón. Así que voy a utilizar la etiqueta Button con el botón Enviar. Para crear este formulario podría haber creado realmente un formulario, lo que pasa es que como tengo que manipular los datos antes de enviarlo me resulta más cómodo hacer simplemente un listado de elementos con campos y luego recuperar los datos de esos campos. Lo guardo... voy a pedir que refresque, ese refresco se hace automáticamente cada vez que guardo los archivos, bueno, y cuando acabe de refrescar el navegador, podemos ver como ya hemos creado ese formulario. Pulso en el menú, pulso en añadir y aquí tenemos el formulario y tenemos el efecto que he añadido de Floating que me permite escribir haciendo que se mueva y que queda muy chulo.

Ionic práctico: App con REST

Practica creando una aplicación con Ionic, gracias a la combinación de AngularJS, HTML5 y un back-end basado en PHP para servir datos a tu app así como modificar registros.

3:00 horas (38 Videos)
Actualmente no hay comentarios.
 

Este curso video2brain está disponible como descarga y para ser visualizado online. ¡Pero no hace falta que decidas entre las dos opciones! Al comprar el curso, disfrutarás de ambas posibilidades.

La descarga te permite ver las lecciones sin estar conectado/a a internet y supone una navegación fácil y ágil entre capítulo y capítulo. Si vas a trabajar en diferentes ordenadores o si no quieres descargarte el curso completo, entra en la web con tus datos de acceso y disfruta directamente de tus vídeos online. Te deseamos que disfrutes de este curso y te resulte de mucha utilidad.

Estamos a tu disposición si tienes cualquier tipo de duda o pregunta.