Tipos de campos de los formularios (HelperForm) en Prestashop

Introducción (leer atontados)

No voy a comentar todos los tipos de campos disponibles para usar en Prestashop, pero espero que los que vaya comentando junto con su explicación de forma detallada os sirva de ayuda.

Aquí solo hablamos de la generación de formularios no de guardar esos datos y obtener los valores de los formularios, cosa que tenéis explicada en el blog en varios TIPS desde hace años.

Empecemos:

Por ejemplo, en la pestaña Diseño -> Páginas  al editar unos de los contenidos o crear uno nuevo, veremos que tenemos los siguientes campos disponibles:

Campos

Al acceder al controlador: /controllers/admin/AdminCmsController.php

Veremos dentro de:  $this->fields_form = array( … ‘input’ => array los campos del formulario:

Campos

El formulario se inicia a partir de: $this->fields_form = array(

Inicio formulario

Donde podemos ver la etiqueta/título del formulario y el icono

Etiqueta formulario
Etiqueta formulario
Etiqueta formulario
Icono formulario
Icono formulario
Icono formulario

La opción: tinymce es para activar el editor TinyMCE (el típico editor que veis en las descripciones para colocar negritas, añadir imágenes, etc..) en el formulario. Posteriormente podemos indicar en que campo queremos activarlo o dejar de activarlo.

A continuación, dentro de:  ‘input’ => array( … )’ visualizamos los campos del formulario.

Y cuando cerramos el array de campos (input) metemos los botones del formulario (para guardar los cambios, etc..)

Botones

En este TIP, vamos a hablar de algunos de los campos que vemos en la sección de la ficha de edición a la que hacemos referencia, si en algún momento hablamos de otro campo distinto a los indicados en la captura inicial comentaremos donde hemos visto el campo.

Tipos de campo: Lista desplegable (HelperForm)  en Prestashop

Siguiendo lo que habíamos comentado anteriormente, vamos a ver los tipos de campos que teníamos disponible al editar un contenido en la pestaña Diseño -> Páginas

Controlador: /controllers/admin/AdminCmsController.php

Vemos el campo “categoría de la página de contenidos“:

Categoría página

Correspondiente al siguiente código:

  • type -> tipo del campo (En este caso select_category)
  • label -> Etiqueta del campo

    Etiqueta campo
    Etiqueta campo
  • name -> nombre interno del campo
  • options -> Recordamos que este campo es una lista desplegable (select). En este caso estamos cargando el array de categorías en los valores del campo
    Lista desplegable
    Lista desplegable

    Si intentamos ver en el fichero el valor de la variable, veremos la siguiente asignación:

    Asignación variable
    Asignación variable

    Donde estamos obteniendo los valores de las categorías de los contenidos que hemos creado en la pestaña Diseño -> Páginas

    Los esta cargando de la función: recurseCMSCategory de la clase /classes/CMSCategory.php

Función recurseCMSCategory
Función recurseCMSCategory

Por ejemplo, en la pestaña Clientes -> Clientes vemos en la ficha de edición de los Clientes el “Grupo de clientes predeterminado

Selector

Al acceder al fichero: controllers/admin/AdminCustomersController.php lo encontramos en esta parte del código:

Tipo lista desplegable

type -> select (para indicar que es un campo de lista desplegable)
label -> Etiqueta del campo
name -> nombre interno
options -> valores del campo (lista)
hint -> texto que se muestra al pasar el ratón sobre el nombre del campo

Tipos de campo: Texto (HelperForm)  en Prestashop

Siguiendo con la ficha de edición de un contenido en la pestaña Diseño -> Páginas, observamos el campo “Meta descripción“.

Campo

Al acceder al controlador/controllers/admin/AdminCmsController.php vemos el siguiente código:

Campo de tipo texto

En type viene indicado “text” para indicar que es un campo de tipo texto.

En label, recordamos que es la etiqueta del campo.

Etiqueta campo

name -> nombre interno del campo

lang -> Para indicar si el campo es multilenguaje o no

multilenguaje

hint -> Información que aparece al pasar el ratón sobre el campo

Información adicional

Tipos de campo: Tags/Etiquetas (HelperForm)  en Prestashop

Seguimos en la ficha de edición de una página de contenidos en la pestaña Diseño -> Páginas y nos fijamos en el campo de “Meta Keywords / Meta palabras claves”

Campo etiquetas
Campo etiquetas

Al acceder al controlador/controllers/admin/AdminCmsController.php vemos el siguiente código (referente a dicho campo) :

Tipo de campo tags

type -> “tags” para indicar que es un campo de tipo etiquetas
label -> Etiqueta del campo
name -> nombre interno del campo
lang -> para indicar que el campo es multilenguaje.
hint -> Como hemos comentado antes, al pasar el ratón sobre el nombre del campo muestra información adicional.

Tipos de campo: Switch – Selección (HelperForm)  en Prestashop

Para no aburrirnos, seguimos con la ficha de edición de una página de contenidos en la pestaña Diseño -> Páginas

A continuación, vemos el campo “Indexación por motores de búsqueda” que nos ofrece entre seleccionar Sí o No.

switch

Al acceder al controlador/controllers/admin/AdminCmsController.php observamos el siguiente código:

switch

type -> switch
label -> etiqueta del campo
name -> nombre interno del campo
required -> para indicar si el campo es obligatorio.
values -> valores del campo

Valores del campo

Tipos de campo: Textarea/campo de texto en Prestashop (HelperForm)

Seguimos con la fiesta con la pestaña Diseño -> Páginas.

Nos encontramos con el campo del contenido de la página.

textarea

Cuando accedemos al controlador/controllers/admin/AdminCmsController.php observamos el siguiente código:

Código campo textarea
Código campo textarea

type  -> textarea para indicar el tipo de campo en cuestión.
label -> etiqueta del campo.
name -> nombre interno del campo.
autoload_rte -> para indicar si nos aparecerá el editor en el panel en el campo en cuestión.

Opción activada

Editor activado

Opción desactivada

Editor desactivado

lang -> para indicar si el campo es multilenguaje
rows y cols las típicas opciones de filas y columnas del tamaño del campo a la hora de visualizarlo.
hint -> Nota informativa que se visualiza cuando pasas el ratón sobre el nombre del campo

Tipos de campo: Campo selector de tiendas (HelperForm) en Prestashop

Seguimos dentro de la pestaña Diseño -> Páginas 

Campo tiendas

Controlador: /controllers/admin/AdminCmsController.php

Campo selector tiendas

En este ejemplo, como hemos salido de ‘input’ => array( … )’ (array de campos) y  también  del formulario lo que hacemos es meterlo directamente dentro del array con:

$this->fields_form[‘input’][] = array(

type -> “shop” para indicar que es un tipo de campo de tiendas
label -> etiqueta informativa
name -> nombre interno del campo

Tipo de campo: Campo contraseña (HelperForm) en Prestashop

Al acceder a la pestaña Clientes -> Clientes del panel de administración e intentar añadir un cliente o editar uno existente, veremos en el formulario del cliente entre otros campos disponibles el campo de contraseña:

Campo contraseña

Al acceder al controlador:

/controllers/admin/AdminCustomersController.php

Vemos el código de visualización del campo aquí:

Campo contraseña

type -> password para indicar que es un campo de tipo contraseña.
label -> Etiqueta del campo.
name -> nombre interno.
required -> para indicar si es o no obligatorio.
hint -> texto que se muestra al pasar el ratón sobre el nombre del campo.

Tipo de campo: Campo Email (HelperForm) en Prestashop

Seguimos con la pestaña Clientes -> Clientes y controlador:  /controllers/admin/AdminCustomersController.php

Campo email

Código:

Campo email

Realmente es un campo de tipo de texto, perocomo podéis ver en el “type”, la única variación es que en “prefix le añadimos la instrucción para que muestre el icono del correo:

Icono Email
Icono Email
Icono Email

Tipo de campo: Campo fecha/cumpleaños (HelperForm) en Prestashop

Siguiendo con el panorama en la pestaña Clientes -> Clientes

Fecha nacimiento
Fecha nacimiento

Código del campo en el fichero:  /controllers/admin/AdminCustomersController.php

Campo fecha de cumpleaños

type -> birthday para indicar que estamos trabajando con este tipo.
label -> Etiqueta el campo
name -> nombre interno del campo
options -> valores del campo, en este caso estamos cargando los días, meses y años.

Valores del campo

Por cierto, le estamos pasando la variable $days, $months y $years  que tiene el valor de días, meses y años porque antes las hemos declarado en la clase.

Obtener días, meses y años

Tipo de campo: Campo Radio / selección única  (HelperForm) en Prestashop

Siguiendo con el panorama en la pestaña Clientes -> Clientes

Campo selección única

Vemos el código de este campo en el fichero:  /controllers/admin/AdminCustomersController.php aquí:

Para no repetir lo mismo que hemos repetido, simplemente comentar el “type -> radio

Por otro lado en “values” cargamos los valores del campo, que en este caso los esta cargando de la variable $list_genders, que realmente tiene este valor:

Lo que hacemos es obtener los géneros/tratamientos que hemos configurado.

Tipo de campo: Grupo de campos con CheckBock   (HelperForm) en Prestashop

Ya que estamos en la pestaña Clientes -> Clientes y  como no queremos movernos mucho observemos el campo: “Acceso a grupo

Acceso a grupo

Al observar el código del campo en el fichero:

/controllers/admin/AdminCustomersController.php

Veremos:

group

type -> group.
name -> nombre interno del campo.
label -> etiqueta de campo.
values -> valores del campo. Aquí estamos cargando los grupos de clientes creados en Prestashop.

¿Qué contiene la variable $groups?

Valor almacenado en la variable groups
Valor almacenado en la variable groups
Función getGroups
Función getGroups

Obtenemos el grupos de clientes gracias a la función getGroups de la clase Group

Tipos de campo: Botones en los formularios de Prestashop (HelperForm)

Seguimos dentro de la pestaña Diseño -> Páginas.

Botones “Guardar y previsualizar” y “Guardar

Botones

Controlador/controllers/admin/AdminCmsController.php

Al cerrar el: ‘input’ => array( … )’ (array de campos) pero dentro de  $this->fields_form = array() vemos los botones disponibles que mostramos en la captura anterior

Botón guardar:

botón “guardar y previsualizar

array botones
array botones

Dentro del array de botones encontramos el botón “Guardar y previsualizar” (buttons => array { botón de guardar y previsualizar (save_and_preview)
name -> nombre interno del botón
type -> submit
title -> título del botón

Título botón

icon -> icono del botón

Icono del botón

class -> clase del botón.

Necesita investigar más…

  • Pásate por el directorio: /classes/helper/ y revisa las clases.
  • Investiga como usan los controladores del panel de administración:  /controller/admin/ el tema de los formularios y campos. Fíjate que aquí hemos hablado de 2 controladores…
  • Pásate por las clases de los módulos /modules/nombre_modulo/nombre_clase.php e investigan como usan los módulos los formularios (dentro de la función renderForm) además veras que necesitan crear una instancia de la clase HelperForm para la generación del formulario, como estuvimos comentando en su momento por el blog hace unos 2 años. Usar buscador del blog 🙂