Validation patterns not displaying for custom Phone component in AEM Adaptive Forms
This article explains how to resolve an issue in Adobe Experience Manager (AEM) Adaptive Forms where validation patterns do not appear for a custom Phone component based on the Core Telephone Input component. The issue occurs when the custom component does not correctly inherit or reference the required validation configuration from the Core Component. To resolve the issue, review the component implementation, template configuration, and inherited settings to ensure validation patterns are available.
Description description
Environment
- Adobe Experience Manager (AEM) Adaptive Forms, all versions
- Custom Phone component based on the Core Telephone Input component
Issue/Symptoms
- Validation patterns do not appear for the custom Phone component in the form UI.
- The standard Core Telephone Input component displays validation patterns as expected.
Root Cause
Missing or incorrect design dialog or template configuration in the custom component prevents validation patterns from appearing in the form UI.
Resolution resolution
Follow the steps below to resolve the issue.
- Review the custom Phone component implementation. Ensure that
sling:resourceSuperTypeis set to the Core Telephone Input component path, for example,/apps/core/fd/components/form/telephoneinput/v1/telephoneinput, and verify that the custom component does not override or omit any configuration required for validation patterns. - Review the template configuration. Confirm that the template used for the Adaptive Form includes the required design configurations for validation patterns. If necessary, create a new template and apply it to the affected forms to determine whether validation patterns appear.
- Compare the custom component with the standard Core Telephone Input component. Add the standard component to a form and verify that validation patterns appear as expected. If the standard component works correctly, review the differences between the standard and custom implementations.
- Review the Adobe documentation for customizing Adaptive Forms Core Components. Refer to Customize Adaptive Forms Core Components for additional guidance.
- Verify the resolution by confirming that validation patterns appear for the custom Phone component in the form UI.
recommendation-more-help
experience-cloud-kcs-help-kbarticles