Is Possible expose Adaptive Forms "content as service (similar to XFs/CFs) " | Community
Skip to main content
Level 5
June 5, 2023
Solved

Is Possible expose Adaptive Forms "content as service (similar to XFs/CFs) "

  • June 5, 2023
  • 2 replies
  • 886 views

Hi Team

 

I would like add the Adaptive forms (embedded) in webpage which outside of AEM 

 

Here is Use case :

Developing the forms at AEM use these from outside of AEM i.e. embedded to webpages .

 

I am referring below URL , if embedded the adaptive form to webpages any issues Adaptive OOTB Services invoking & responsiveness (mobile devices to achieve omni channel feature)

https://experienceleague.adobe.com/docs/experience-manager-65/forms/adaptive-forms-basic-authoring/embed-adaptive-form-external-web-page.html?lang=en

 

Regards

Vara

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by Rohan_Garg

You can create Headless adaptive forms. A Headless adaptive form is essentially a JSON structure (schema) consisting form fields (Text box, choices, and many more fields) and corresponding rules (conditional logic) to add interactive behavior to the form. You can use REST APIs in your application or website to request the hosted JSON structure and natively render the JSON structure as a form in your app or website.

 

Source URL - https://experienceleague.adobe.com/docs/experience-manager-headless-adaptive-forms/using/architecture.html?lang=en

https://experienceleague.adobe.com/docs/experience-manager-headless-adaptive-forms/using/overview.html

Send an email to headlessadaptiveforms@adobe.com from your official email ID to join the early adopter program.

2 replies

ksh_ingole7
Community Advisor
Community Advisor
June 6, 2023

Hi @varaande 

 

If you are planning to expose the Adaptive form to a WEBPAGE on some other website, easier way would be to iFrame it on the other external website. You might have to add a CSP header to allow the external website to use your content. But this is an easier way to use Adaptive form. 

 

If in case you want to expose it to a mobile app, Content as a service is the way to go. 

 

To do so,

Add your form on an Experience Fragment and Expose the experience fragment using content as a service.

 

 

Thanks

Rohan_Garg
Community Advisor
Rohan_GargCommunity AdvisorAccepted solution
Community Advisor
June 6, 2023

You can create Headless adaptive forms. A Headless adaptive form is essentially a JSON structure (schema) consisting form fields (Text box, choices, and many more fields) and corresponding rules (conditional logic) to add interactive behavior to the form. You can use REST APIs in your application or website to request the hosted JSON structure and natively render the JSON structure as a form in your app or website.

 

Source URL - https://experienceleague.adobe.com/docs/experience-manager-headless-adaptive-forms/using/architecture.html?lang=en

https://experienceleague.adobe.com/docs/experience-manager-headless-adaptive-forms/using/overview.html

Send an email to headlessadaptiveforms@adobe.com from your official email ID to join the early adopter program.

varaandeAuthor
Level 5
June 6, 2023

Thank you Rohan.

 

Using either JSON (or XML Schema)  , Can we handle the User's Filled data retrieve which is going to persist into DB & Download as PDF (filled data) in external webpage .

 

 

 

Rohan_Garg
Community Advisor
Community Advisor
June 7, 2023

The download as PDF feature for filled data can be handled using DOR (Document of Record).

The DOR can be generated programmatically. (Reference https://experienceleague.adobe.com/docs/experience-manager-learn/forms/adaptive-forms/document-of-record-api-tutorial-use.html?lang=en)

 

As for the saved data which is going to persist in DB, the REST API endpoint is the usual mechanism but as per Headless Form's architecture it should be possible to prefill (fetch) and submit data in JSON format.

Source - https://experienceleague.adobe.com/docs/experience-manager-headless-adaptive-forms/using/architecture.html?lang=en