Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

Need help wrt CQ5 form

Avatar

Level 1

Hi there,

I have got a requirement which has 2 parts: 1) the form content will be saved into a jcr node, and 2) the form content will be sent out to a specific email address. I have used CQ5 foundation form component in order to implement part 1. In there, I specified the form action type as 'Store Content' and the form content path which is storing the form content right at the location. However, I am facing an issue with part 2. I created a emailServlet class which handles the generic email implementation specific to my project. This class resides in the project's bundle. Now my question is, how  I can implement the part 2 using the cq5 form action (type = Mail) to forward it to my email Servlet class. Please let me know how to resolve it. Thanks in advance.

1 Accepted Solution

Avatar

Correct answer by
Level 10

Define custom form action

* Overlay "/libs/foundation/components/form" to "/apps/foundation/components/form"
* Configure an overlaid custom form action.You can do this by creating the following node path where customaction can be any name you want: it must have the following properties defined under it sling:resourceType="foundation/components/form/action"
jcr:title="My Custom Form Action"
* It must have a dialog node defined with fields (this will be used for the 2nd tab under "Action Configuration" when you add a CQ "Form" component)
* Create a post servlet as a bundle to handle your request that is store and send a confirmation email (which you already inbuild).
* In a page Configure a Form component and select your custom form action.

If required will post some sample code for this later, I just wanted give you a general idea of how this is done. For the ootb form actions look under /libs/foundation/components/form/actions there are good examples.

View solution in original post

4 Replies

Avatar

Correct answer by
Level 10

Define custom form action

* Overlay "/libs/foundation/components/form" to "/apps/foundation/components/form"
* Configure an overlaid custom form action.You can do this by creating the following node path where customaction can be any name you want: it must have the following properties defined under it sling:resourceType="foundation/components/form/action"
jcr:title="My Custom Form Action"
* It must have a dialog node defined with fields (this will be used for the 2nd tab under "Action Configuration" when you add a CQ "Form" component)
* Create a post servlet as a bundle to handle your request that is store and send a confirmation email (which you already inbuild).
* In a page Configure a Form component and select your custom form action.

If required will post some sample code for this later, I just wanted give you a general idea of how this is done. For the ootb form actions look under /libs/foundation/components/form/actions there are good examples.

Avatar

Level 1

Thanks for your reply. Well, I should have mentioned earlier, that I need to use captcha on the form. Hence, the CQ5 form (foundation component) is a way to achieve this along with other form component used on the same same form. So far I have created a jsp page where I have included this following component:

<cq:include path="par" resourceType="foundation/components/parsys"/>

I have used the form action type as "Store Content" and specified a jcr path where I want the form contents to be stored. 

When the specific page renders, it displays all the form components that I added on to the CQ5 form and store the data into the jcr node properly.

Since the task has got another requirement to mail out the form details, I need to create another form action to implement that functionality. Hence, I created a custom action component which has got the following properties: jcr:primaryType="sling:Folder" , jcr:title="Custom Form Action", sling:resourceType="foundation/components/form/action",     componentGroup=".hidden"

It doesn't have the dialog node since the task doesn't have any such requirement. However, it has got a forward.jsp page which contains the following contents:

<%@page session="false" %><%
%><%@page import="com.day.cq.wcm.foundation.forms.FormsHelper"%><%
%><%@taglib prefix="sling" uri="http://sling.apache.org/taglibs/sling/1.0" %><%
%>
<%@page import="com.day.cq.wcm.foundation.forms.FormsConstants"%><sling:defineObjects/><%
    FormsHelper.setForwardPath(slingRequest, "/apps/whereis/servlets/MapEditorServlet");
    request.setAttribute(FormsConstants.REQUEST_ATTR_REDIRECT_TO_REFERRER,
            "true");
%>

In the MapEditorServlet class, the form contents will be extracted from the jcr node and pass it onto a separate Helper class for sending out the email using a custom template.

The question that I have got for you is whether the CQ5 form component allows more than one form action (like in my case, 'Store Content' and 'Custom Form Action')? Given the task requirement, do you have any other better suggestion of how to implement it? Please let me know your response soon. Thanks.

Avatar

Level 10

Another way you can easily solve this use case is to write a form and have it post form data to a sling servlet.

See: http://helpx.adobe.com/experience-manager/using/custom-sling-servlets.html

Then you can persist the data into the JCR - see:

http://helpx.adobe.com/experience-manager/using/persisting-cq-data-java-content1.html

Finally -- create a custom email service to email the form data. Because its Java - you can easily add this app logic to the servlet. See:

http://helpx.adobe.com/experience-manager/using/creating-custom-cq-email-services.html

Avatar

Level 1

Thanks so much for your reply.

Well, I did use the HTML5 form in the first place and that did pass the form data to a Sling Servlet. However, as per the task requirement, I need to include captcha on the form. I tried to include CQ5 form captcha into the HTML5 form, like this:

<form id="myForm" role="form" action="/xxx/xxxx/xxxxx/xxxxxx"  method="POST" enctype="multipart/form-data">

................

    <cq:include path="formCaptcha" resourceType="foundation/components/form/captcha"/>

</form>

But the issue then raised with the validation. How I can do the server-side validation with the captcha key? More specifically, how the two values :captchaKey and :captcha can be passed on to the "myForm"? 

Since I don't have full knowledge on this, I switched on to using the CQ5 form component. So, if I can get a work around on using the CQ5 form captcha inside a HTML5 form then it'd be great. Please let me know your response soon as this is blocking the project. Thanks in advance.