formularios al limite
TRANSCRIPT
![Page 1: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/1.jpg)
![Page 2: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/2.jpg)
![Page 3: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/3.jpg)
formularios al limite
Ignacio Velazquez
@nass600
ignaciovelazquez.es
deSymfony | 2012
![Page 4: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/4.jpg)
quien soy
• Ingeniero Informático de Madrid
• Seguridad IT & Gráficos en
Hannover, Alemania
• PFC con Symfony1 en Chicago, USA
• Programador PHP & Symfony2 @ ideup!
• Maquetador en tiempos libres
![Page 5: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/5.jpg)
root
• Formularios en Symfony2
• Objetos de dominio
• Validación
• Demo 1
• Colecciones prototipadas
• Eventos y Subscriptores
• Demo 2
![Page 6: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/6.jpg)
formularios en Symfony2
![Page 7: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/7.jpg)
root/formularios
• Componente:
– Creación de formularios
– Sincronización de datos (app <-> client)
– Guessing de tipos
– Automatiza la validación de datos
(Componente Validator)
– Creación de la vista
![Page 8: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/8.jpg)
root/formularios/mi-bundle
• Tipos:
– Definen el formulario y los campos
• Handlers:
– Procesan el formulario
• Objetos de dominio (opcional):
– Contienen los datos
• Eventos (opcional):
– Modifican el formulario o sus datos
• Transformadores (opcional):
– Modifican los datos entre la aplicación y el cliente
![Page 9: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/9.jpg)
root/formularios/mi-bundle/estruct
eventos
handlers
objetos de dominio
Tipos + campos
personalizados
![Page 10: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/10.jpg)
root/formularios/creación
![Page 11: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/11.jpg)
root/formularios/procesado
![Page 12: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/12.jpg)
objetos de dominio
![Page 13: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/13.jpg)
root/objetos-de-dominio
• Moldean el objeto para su uso en los
formularios
• Tienen mas o menos campos que la clase
final
• Aíslan la notación de la validación de la
entidad
• Permiten cambiar el tipo a los campos
• No esta acoplado al mapeo de Doctrine
![Page 14: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/14.jpg)
root/objetos-de-dominio/uso/1
• Creamos el objeto de
dominio
• Añadimos las
restricciones
• Preparamos el mapeo de
datos del constructor
![Page 15: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/15.jpg)
root/objetos-de-dominio/uso/2
• Creamos la acción en el controlador
• Pasamos el objeto del modelo al objeto de dominio
para el mapeo de datos en la creación del formulario
• Mandamos la vista del formulario
![Page 16: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/16.jpg)
root/objetos-de-dominio/uso/3
• Creamos el tipo con los
campos del objeto de
dominio
• Asignamos a data_class
el namespace del objeto
de dominio
![Page 17: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/17.jpg)
validación
![Page 18: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/18.jpg)
root/validacion
• Sistema de restricciones de datos
• Principal uso en formularios (también
como servicio)
• Se utiliza en el bind de datos del
formulario
• Se puede implementar de varias maneras
![Page 19: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/19.jpg)
root/validacion/tipos
• Mediante Asserts en campos concretos
(anotaciones, yml…)
• Grupos de validaciones
• Callbacks
• Restricciones personalizadas (Custom
Constraints)
![Page 20: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/20.jpg)
root/validacion/callbacks
• Se pueden usar para validaciones
condicionales
• Pueden intervenir múltiples campos
• Se integran en la Entidad o en el Objeto
de Dominio
![Page 21: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/21.jpg)
root/validacion/callbacks/uso
• Le indicamos al
objeto el callback que
tiene que usar
• Cuando valide
ejecutara el código
para comprobar la
nueva restricción
• Añade el error al
campo que le
indiquemos
![Page 22: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/22.jpg)
root/validacion/restriccion-pers
• Añaden mas restricción al formulario
creando un Constraint nuevo
• Modulable y reusable
![Page 23: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/23.jpg)
root/validacion/restriccion-pers/uso
• Directamente
añadimos la nueva
restricción al campo
• Creamos la
restricción y su
validador
![Page 24: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/24.jpg)
demo 1
![Page 25: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/25.jpg)
colecciones prototipadas
![Page 26: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/26.jpg)
root/colecciones
• Grupo de formularios del mismo tipo
embebidos en otro
• Validado recursivo
• Persistencia automática gracias a Doctrine
(warning!!)
![Page 27: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/27.jpg)
root/colecciones/prototipos
• Permiten añadir o eliminar elementos de
la colección en el formulario
• Ofrecen el prototipo del template de un
elemento de la colección para añadir
nuevos items con javascript
![Page 28: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/28.jpg)
root/colecciones/vista
• Renderizamos toda la colección y el
template del prototipo mediante un Twig
Theme
• Problema con los ids de los elementos de
la colección (_form_field_x_widget)
![Page 29: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/29.jpg)
root/colecciones/prototipos/uso/1
Tipo del formulario
• Añadimos el tipo de los
elementos de la colección
• Habilitamos los atributos
allow_add y allow_delete
![Page 30: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/30.jpg)
root/colecciones/prototipos/uso/2
• Usando un twig
theme creamos un
bloque que se ocupe
tanto del prototipo
como del
renderizado de los
hijos
![Page 31: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/31.jpg)
root/colecciones/prototipos/uso/3
Javascript
• Añadimos los
hooks para añadir y
eliminar elementos
de la colección
• Reemplazamos el
placeholder con un
id numérico
![Page 32: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/32.jpg)
eventos y suscriptores
![Page 33: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/33.jpg)
root/eventos
• Modificación de datos, del formulario o
ejecución de acciones durante el ciclo de
vida de un formulario.
• Eventos al crear el formulario
• Eventos al procesarlo
![Page 34: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/34.jpg)
root/eventos/tipos
• Envío de datos (setData)
– Lanzados en la asignación de datos al
formulario
– Manipulan los datos de aplicación (modelo)
• Recepción de datos (bind)
– Lanzados en la unión de los datos de cliente
(form) y los de aplicación (modelo)
![Page 35: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/35.jpg)
root/eventos/tipos/envio
• PRE_SET_DATA
• SET_DATA
• POST_SET_DATA
![Page 36: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/36.jpg)
root/eventos/tipos/recepcion
• PRE_BIND
• BIND_CLIENT_DATA
• BIND_NORM_DATA
• POST_BIND
![Page 37: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/37.jpg)
root/eventos/suscriptores
• Tipo de Listener
• Previamente le dice al Dispatcher que
eventos va a escuchar
• Abstracción del manejo de eventos de los
formularios
![Page 38: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/38.jpg)
root/eventos/suscriptores/uso/1
• Creamos la clase y
escuchamos en el
evento que
queremos
• Añadimos la lógica
que va a ser lanzada
![Page 39: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/39.jpg)
root/eventos/suscriptores/uso/2
• Añadimos el
suscriptor en el tipo
del formulario
![Page 40: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/40.jpg)
demo 2
![Page 41: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/41.jpg)
preguntas?
![Page 42: Formularios al limite](https://reader031.vdocuments.pub/reader031/viewer/2022020105/5597041c1a28ab784f8b47da/html5/thumbnails/42.jpg)
gracias
• www.slideshare.net/nass600/formularios-al-limite