Componente de fecha y hora
Un componente de fecha y hora de un formulario adaptable es un elemento de interfaz de usuario que permite a los usuarios seleccionar fecha y hora mediante una interfaz de calendario y reloj, o introduciendo manualmente valores en un formato específico. Garantiza una entrada precisa y estandarizada para casos de uso en los que tanto la fecha como la hora son esenciales.
Ejemplo
Uso reasons-to-use-date-time-picker
Existen varias razones por las que es beneficioso incluir un selector de fecha y hora en un formulario, entre ellas:
- Comodidad: permite a los usuarios elegir fácilmente una fecha y una hora sin necesidad de escribir valores manualmente.
- Coherencia: Aplica un formato estándar para las entradas de fecha y hora en todo el formulario.
- Experiencia del usuario mejorada: Proporciona una interfaz de usuario intuitiva con selectores de calendario y hora.
- Programación de eventos: útil en la reserva de citas, entrevistas o formularios de programación de reuniones.
- Viajes y reservas: permite a los usuarios seleccionar las fechas y horas de llegada y salida.
- Precisión de datos: reduce los errores de entrada en comparación con la entrada de texto libre.
Versión y compatibilidad version-and-compatibility
El componente principal Fecha y hora de Forms adaptable se publicó en agosto de 2025 como parte de Componentes principales 2.24.6 para Cloud Service y versiones posteriores.
versión 2.24.6 y posteriores
Para obtener más información sobre las versiones, consulte Versiones de componentes principales.
Detalles técnicos technical-details
Obtenga los detalles técnicos más recientes sobre el componente principal Fecha y hora de Forms adaptable en GitHub. Para obtener más información sobre el desarrollo de componentes principales, consulte Documentación para desarrolladores de componentes principales.
Cuadro de diálogo de configuración configure-dialog
El cuadro de diálogo de configuración permite personalizar la fecha y la hora.
Pestaña Básicos basic-tab
-
Nombre: el nombre identifica de forma exclusiva el componente en el editor de reglas. No se permiten caracteres especiales ni espacios en las cadenas de nombre.
-
Título: el título es una cadena que aparece en la parte superior de un componente en un Formulario adaptable. El título identifica de forma exclusiva el componente en la estructura de árbol de un formulario adaptable. Si no agrega un título, se mostrará el nombre del componente en lugar del texto del título.
-
Permitir texto enriquecido en el título: esta función permite a los usuarios dar formato a los títulos de texto sin formato, incorporando funciones como negrita, cursiva, texto subrayado, varias fuentes, tamaños de fuente, colores y opciones adicionales para mejorar la presentación visual y la personalización. Ofrece una mayor flexibilidad y control creativo para hacer que los títulos destaquen dentro de los documentos, sitios web o aplicaciones.
Al seleccionar la casilla de verificación de Permitir texto enriquecido en el título, las opciones de formato se vuelven visibles para aplicar estilo al título del componente. Para acceder a todas las opciones de formato disponibles, puede hacer clic en la pestaña -
Ocultar título: seleccione esta opción para ocultar el título del tipo de componente en un Formulario adaptable.
-
Texto del marcador de posición: el texto del marcador de posición de un componente de formulario hace referencia a una etiqueta o indicación corta que aparece dentro de un campo de entrada como una sugerencia al usuario sobre qué tipo de información se espera que se introduzca en ese campo. El texto del marcador de posición desaparece cuando el usuario empieza a escribir en el campo y vuelve a aparecer si el campo se deja vacío. Proporciona una pista visual al usuario, pero no actúa como etiqueta o valor permanente para el campo.
-
Referencia de vínculo: una referencia de vínculo es una referencia a un elemento de datos que se almacena en una fuente de datos externa y se utiliza en un formulario. La referencia de enlace permite enlazar datos de forma dinámica a campos de formulario, de modo que el formulario pueda mostrar los datos más actualizados de la fuente de datos. Por ejemplo, se puede utilizar una referencia de enlace para mostrar el nombre y la dirección de un cliente en un formulario, según el ID introducido en el formulario por el cliente. La referencia de enlace también se puede utilizar para actualizar la fuente de datos con los datos del formulario. De este modo, AEM Forms permite crear formularios que interactúen con orígenes de datos externos, lo que proporciona al usuario una experiencia óptima para recopilar y administrar datos.
-
Marcar como elemento de formulario independiente: seleccione la opción para configurar un campo de formulario no vinculado a ningún esquema. Esta opción le permite guardar datos sin actualizar la fuente de datos. También le permite gestionar los datos de forma personalizada, independientemente de la integración de bases de datos estándar.
-
Ocultar componente: seleccione la opción para ocultar el componente del formulario. El componente permanece accesible para otros fines, como utilizarlo para los cálculos en el Editor de reglas. Esto resulta útil cuando necesita almacenar información que el usuario no necesita ver o cambiar directamente.
-
Deshabilitar componente: seleccione la opción para desactivar el componente. El componente desactivado no está activo ni puede editarlo el usuario final. El usuario puede ver el valor del campo, pero no modificarlo. El componente permanece accesible para otros fines, como utilizarlo para los cálculos en el Editor de reglas.
-
Solo lectura: seleccione la opción para que el componente no se pueda editar. El usuario puede ver el valor del campo, pero no modificarlo. El componente permanece accesible para otros fines, como utilizarlo para los cálculos en el Editor de reglas.
-
Fecha y hora predeterminadas: esta opción le permite agregar una fecha y una hora al campo de formulario. La fecha introducida aparece de forma predeterminada en el lugar del componente. Si el usuario no introduce ninguna fecha u hora, este valor se envía en el momento del envío del formulario. En caso de que se seleccione Componente deshabilitado o Componente de solo lectura, la fecha y la hora predeterminadas se mostrarán en la pantalla y se enviarán en el momento del envío del formulario.
Pestaña Validación validation-tab
-
Obligatorio: seleccione esta opción si desea mostrar el componente en un formulario adaptable. Después de seleccionar la opción, debe realizar una selección antes de continuar con el envío de un formulario. No puede seleccionar Ocultar componente o Desactivar componente en la pestaña Básicos cuando esta opción está seleccionada.
-
Mensaje de error: esta opción permite introducir un mensaje que se muestra si se marca la casilla Obligatorio y el campo del formulario se deja en blanco.
-
Mensaje de validación de la secuencia de comandos: esta opción permite introducir un mensaje que se mostrará si la validación de la secuencia de comandos falla.
-
Fecha mínima: esta opción permite introducir la fecha mínima requerida. Si introduce una fecha anterior a la especificada en Fecha y hora mínimas, aparecerá un mensaje de error en la pantalla. El cuadro de diálogo Mensaje de error mínimo permite añadir un mensaje de error personalizado.
-
Mensaje de error mínimo - El cuadro de diálogo Mensaje de error mínimo le permite agregar un mensaje de error personalizado para que se muestre si escribe una fecha u hora anterior a la fecha u hora especificada en la opción Fecha mínima.
-
Fecha máxima: esta opción le permite especificar la fecha y la hora máximas requeridas. Si introduce una fecha u hora posterior a la especificada en Fecha máxima, aparecerá un mensaje de error en la pantalla. El cuadro de diálogo Mensaje de error máximo permite añadir un mensaje de error personalizado.
-
Mensaje de error máximo - El cuadro de diálogo Mensaje de error máximo le permite agregar un mensaje de error personalizado para que se muestre si escribe una fecha u hora posterior a la fecha u hora especificada en la opción Fecha máxima.
Pestaña Contenido de ayuda help-content-tab
-
Descripción breve: una descripción breve es una explicación de texto corta que proporciona información adicional o aclaraciones acerca del propósito de un campo de formulario específico. Ayuda al usuario a comprender qué tipo de datos se deben escribir en el campo y puede proporcionar directrices o ejemplos para garantizar que la información introducida sea válida y cumpla los criterios deseados. De forma predeterminada, las descripciones cortas permanecen ocultas. Active la opción Mostrar siempre una descripción breve para mostrarla debajo del componente.
-
Mostrar siempre una descripción breve: active la opción para mostrar la descripción breve debajo del componente.
-
Texto de ayuda: el texto de ayuda hace referencia a información o directrices adicionales que se proporcionan al usuario para ayudarle a rellenar correctamente un campo de formulario. Aparece cuando el usuario hace clic en el icono de ayuda (i) situado junto al componente. El texto de ayuda proporciona información más detallada que la etiqueta de un campo de formulario o el texto del marcador de posición, y está diseñado para ayudar al usuario a comprender los requisitos o restricciones del campo. También puede ofrecer sugerencias o ejemplos para que el formulario sea más fácil y preciso.
Pestaña Accesibilidad accessibility-tab
-
Texto para lectores de pantalla: el texto para lectores de pantalla se refiere a texto adicional que está específicamente diseñado para que lo lean tecnologías de asistencia, como lectores de pantalla, que utilizan personas con deficiencias visuales. Este texto proporciona una descripción del audio del propósito del campo de formulario y puede incluir información sobre el título, la descripción, el nombre y cualquier mensaje relevante (texto personalizado) del campo. El texto del lector de pantalla ayuda a garantizar que el formulario sea accesible para todos los usuarios, incluidos los que tengan deficiencias visuales, y les ofrezca una comprensión completa del campo del formulario y de sus requisitos.
- Texto personalizado: seleccione esta opción para utilizar el texto personalizado para las etiquetas de accesibilidad de ARIA. Al seleccionar esta opción, aparece el cuadro de diálogo Texto personalizado. Puede agregar información relevante en el cuadro de diálogo Texto personalizado.
- Descripción: seleccione esta opción para utilizar la descripción para las etiquetas de accesibilidad de ARIA.
- Título: seleccione esta opción para utilizar el título para las etiquetas de accesibilidad de ARIA.
- Nombre: seleccione esta opción para utilizar el nombre para las etiquetas de accesibilidad de ARIA.
- Ninguno: seleccione esta opción si no desea añadir etiquetas de accesibilidad de ARIA.
Cuadro de diálogo Diseño design-dialog
El cuadro de diálogo de diseño se utiliza para definir y administrar estilos CSS para el componente Fecha y hora.
Pestaña Estilos styles-tab
La pestaña se utiliza para definir y administrar estilos CSS de un componente. El componente principal de fecha y hora de Forms adaptable es compatible con el sistema de estilos de AEM.
-
Clases CSS predeterminadas: puede proporcionar una clase CSS predeterminada para el componente principal de fecha y hora de Forms adaptable.
-
Estilos permitidos: puede definir estilos proporcionando un nombre y la clase CSS que representa el estilo. Por ejemplo, puede crear un estilo llamado “texto en negrita” y proporcionar la clase de CSS “grosor de fuente: negrita”. Puede utilizar o aplicar estos estilos a un formulario adaptable en el editor de formularios adaptable. Para aplicar un estilo, en el editor de Formularios adaptables, seleccione el componente al que desee aplicar el estilo, vaya al cuadro de diálogo de propiedades y seleccione el estilo que desee en la lista desplegable Estilos. Si necesita actualizar o modificar los estilos, simplemente vuelva al cuadro de diálogo Diseño, actualice los estilos en la pestaña Estilos y guarde los cambios.
Propiedades personalizadas
Las propiedades personalizadas le permiten asociar atributos personalizados (pares clave-valor) a un componente principal del formulario adaptable mediante la plantilla de un formulario. Las propiedades personalizadas se reflejan en la sección de propiedades de la representación sin encabezado del componente. Permite crear un comportamiento de formulario dinámico que se adapta en función de los valores de atributos personalizados. Por ejemplo, los desarrolladores pueden diseñar varias representaciones de un componente Forms sin encabezado para plataformas móviles, de escritorio o web, lo que mejora significativamente la experiencia del usuario en una amplia gama de dispositivos.
-
Nombre de grupo: puede proporcionar un nombre para identificar el grupo de propiedades personalizadas. Puede agregar, eliminar o reorganizar varios grupos de propiedades personalizadas. Después de añadir el grupo de propiedades personalizadas, podrá ver las siguientes opciones:
-
Pares de clave-valor: puede agregar varios nombres de propiedades personalizadas y valores de propiedades personalizadas haciendo clic en el botón Añadir para cada grupo de propiedades personalizadas.
-
Eliminar: toque o haga clic para eliminar el nombre de la propiedad personalizada y el valor de la propiedad personalizada.
-
Reorganizar: toque o haga clic y arrastre para reorganizar el orden del nombre de la propiedad personalizada y el valor de la propiedad personalizada.
-
Artículos relacionados related-articles
Consulte también see-also
- Crear un formulario adaptable de AEM
- Agregar un formulario adaptable de AEM a la página de AEM Sites
- Aplicar temáticas a un formulario adaptable de AEM
- Añadir componentes a un formulario adaptable de AEM
- Uso de reCAPTCHA en un formulario adaptable de AEM
- Generar la versión de PDF (DoR) de un formulario adaptable de AEM
- Traducir un formulario adaptable de AEM
- Habilitar Adobe Analytics para un formulario adaptable con el fin de realizar un seguimiento del uso del formulario
- Conectar el formulario adaptable a Microsoft SharePoint
- Conectar formularios adaptables a Microsoft Power Automate
- Conectar el formulario adaptable a Microsoft OneDrive
- Conectar el formulario adaptable al almacenamiento de Microsoft Azure Blob
- Conectar el formulario adaptable a Salesforce
- Uso del Inicio de sesión en un formulario adaptable de AEM de Adobe
- Añadir una nueva configuración regional para un formulario adaptable
- Enviar datos de formulario adaptable a una base de datos
- Enviar datos de formulario adaptable a un punto final REST
- Enviar datos de formulario adaptable al flujo de trabajo de AEM
- Utilizar el portal de Forms para ver una lista de formularios adaptables de AEM en un sitio web de AEM