<html lang="es-es" dir="ltr"><head></head><body>### [Cómo mostrar la edad desde un campo de selector de fecha](https://wpforms.com/developers/how-to-display-the-age-from-a-date-picker-field/)

**Publicado:** 2 de agosto de 2023
**Autor:** Umair Majeed

**Extracto:** Este tutorial te guiará sobre cómo mostrar la edad desde un campo de selector de fecha en tu formulario. 

**Contenido:**

## Introducción

¿Te gustaría mostrar la edad de alguien basándote en un campo de selector de fecha en tu formulario? Este tutorial te guiará a través de la creación de un formulario que recopila una fecha de nacimiento (DOB) y luego utiliza JavaScript para calcular y mostrar:

- Su edad **hoy**
- Su edad **en una fecha futura (o pasada) específica**

## Creación del formulario

Comencemos creando un nuevo formulario y agregando nuestros campos. Asegúrate de incluir al menos un campo de **Fecha**.

![crea tu formulario y agrega todos tus campos, incluido al menos un selector de fecha](https://wpforms.com/wp-content/uploads/2023/08/wpforms-display-age-create-form.jpg)Si necesitas ayuda para crear tu formulario, [revisa esta documentación](https://wpforms.com/docs/creating-first-form/ "Creación de tu primer formulario").

## Añadir el campo HTML

Como nuestro objetivo final es presentar la edad una vez que se selecciona el cumpleaños, agreguemos un campo **HTML**. Dentro de este campo, incrustaremos un span HTML vacío, al que se le asignará la clase “age”. Este span vacío servirá como marcador de posición, que mostrará la edad dinámicamente tan pronto como el campo selector de fecha capture la selección del usuario.
``

![agrega un campo html y dentro de ese campo agrega un span HTML vacío con la clase age](https://wpforms.com/wp-content/uploads/2023/08/wpforms-display-age-html-field.jpg)## Añadir el fragmento

Agrega uno de los fragmentos a continuación a tu sitio.

Cada fragmento busca un **ID de formulario** y un **ID de campo de fecha** específicos (ejemplo: `3535_9`). Actualiza esos IDs para que coincidan con tu formulario y campo.

#### Opción 1: Mostrar la edad a partir de hoy

```

/**
 * Calcula la edad basándose en el campo selector de fecha de nacimiento
 *
 * @link https://wpforms.com/developers/how-to-display-the-age-from-a-date-picker-field/
 */
function wpf_dev_check_age() {
?&gt;

**Categorías:** Tutoriales

**Etiquetas:** Campo de fecha y hora, Javascript, JS

---</body></html>