AEM Form should send payload to an external API to show success of failure message | Community
Skip to main content
T
Tessa_learner1
Level 4
March 24, 2022
Solved

AEM Form should send payload to an external API to show success of failure message

  • March 24, 2022
  • 1 reply
  • 1470 views

Hi all, 

I'm creating a registration form using core form container. I need to send form payload to external API then using that API I need to show success or failure message after click on the submit button. Can anyone help me with this ??

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 lukasz-m

Hi @tessa_learner1, I see following options for your scenario:

AEM Form Container:

  • You can create OSGi service to communicate with API, e.g. using HttpClient or dedicated SDK - assuming it is available. So all the communication with API will be done in backend side.
  • You can create your own servlet to handle POST from AEM Form Container - but this is a bit tricky and in my opinion it's against the technical design that has been introduced by AEM Form component.

You can find code examples for both above options under https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/form-core-component-submission-using-custom-action-type/m-p/438290

Extend Form Container:

  • Extend AEM Form Container implementation. Write custom servlet to handle form requests, at the same time you should be able to use all Form components like inputs buttons etc. API communication can be done using HttpClient or SDK.

Custom Form:

  • You can communicate directly with API client-side, i.e using jQuery
  • You can create servlet on AEM that will handle/proxy communication with API e.g. using HttpClient or dedicated SDK. Communication with this servlet can be done in classic way - page is reloaded after form submit, or you can hit the servlet from JavaScript and refresh component when you get the response.

In my opinion the second/third option will be better for your case. It will give you more flexibility/control e.g. in terms of error handling.

1 reply

lukasz-m
Community Advisor
lukasz-mCommunity AdvisorAccepted solution
Community Advisor
March 24, 2022

Hi @tessa_learner1, I see following options for your scenario:

AEM Form Container:

  • You can create OSGi service to communicate with API, e.g. using HttpClient or dedicated SDK - assuming it is available. So all the communication with API will be done in backend side.
  • You can create your own servlet to handle POST from AEM Form Container - but this is a bit tricky and in my opinion it's against the technical design that has been introduced by AEM Form component.

You can find code examples for both above options under https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/form-core-component-submission-using-custom-action-type/m-p/438290

Extend Form Container:

  • Extend AEM Form Container implementation. Write custom servlet to handle form requests, at the same time you should be able to use all Form components like inputs buttons etc. API communication can be done using HttpClient or SDK.

Custom Form:

  • You can communicate directly with API client-side, i.e using jQuery
  • You can create servlet on AEM that will handle/proxy communication with API e.g. using HttpClient or dedicated SDK. Communication with this servlet can be done in classic way - page is reloaded after form submit, or you can hit the servlet from JavaScript and refresh component when you get the response.

In my opinion the second/third option will be better for your case. It will give you more flexibility/control e.g. in terms of error handling.

    Terms & ConditionsAccessibility statement

    Loading footer...