Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

Adobe Summit 2023 [19th to 23rd March, Las Vegas and Virtual] | Complete AEM Session & Lab list

How to extend or sub-type \'guideField\' ?

Avatar

Level 3

I'want to implement a kind of sub-type of or specialized text box.

  • The specialized text box shall have an additional property like 'urlForAutocompleteLookUp'.
  • Form authors shall be able to configure the value of this property in the widget's dialog. 
  • The new property shall be exposed in the Jsp object 'guideField' so that I can use it to implement additional logic:
<%------------------------------------------------------------------------ ~ ~ ADOBE CONFIDENTIAL ~ __________________ ~ ~  Copyright 2014 Adobe Systems Incorporated ~  All Rights Reserved. ~ NOTICE:  All information contained herein is, and remains ~ the property of Adobe Systems Incorporated and its suppliers, ~ if any.  The intellectual and technical concepts contained ~ herein are proprietary to Adobe Systems Incorporated and its ~ suppliers and may be covered by U.S. and Foreign Patents, ~ patents in process, and are protected by trade secret or copyright law. ~ Dissemination of this information or reproduction of this material ~ is strictly forbidden unless prior written permission is obtained ~ from Adobe Systems Incorporated. --------------------------------------------------------------------------%> <%-- TextBox Component --%> <%@include file="/libs/fd/af/components/guidesglobal.jsp"%> <%-- todo: In case of repeatable panels, please change this logic at view layer --%> <div class="<%= GuideConstants.GUIDE_FIELD_WIDGET%> ${guideField.multiLine ? " multiline" : ""}" style="${guide:encodeForHtmlAttr(guideField.styles,xssAPI)}"> <c:choose> <c:when test="${guideField.multiLine}"> <textarea id="${guideid}${'_widget'}" name="${guide:encodeForHtmlAttr(guideField.name,xssAPI)}" style="${guide:encodeForHtmlAttr(guideField.widgetInlineStyles,xssAPI)}" placeholder="${guide:encodeForHtmlAttr(guideField.placeholderText,xssAPI)}">${guide:encodeForHtml(guideField.value,xssAPI)}</textarea> </c:when> <c:otherwise> <input type="text" id="${guideid}${'_widget'}" name="${guide:encodeForHtmlAttr(guideField.name,xssAPI)}" value="${guide:encodeForHtmlAttr(guideField.value,xssAPI)}" style="${guide:encodeForHtmlAttr(guideField.widgetInlineStyles,xssAPI)}" placeholder="${guide:encodeForHtmlAttr(guideField.placeholderText,xssAPI)}"/>                 
                <c:if test="${guideField.hasUrlForAutocompleteLookUp}">                    ... ... logic I want to add that will use the property urlForAutocompleteLookUp ...

 

                </c:if>
 
</c:otherwise> </c:choose> <%-- End of Widget Div --%> </div>

My problem is that I don't know how I can add properties to the 'guideField' object.

4 Replies

Avatar

Level 3

Hi,

You can create a new "customized texbox component" which inherits from textbox component and leverage the global object "properties" [1] exposed by AEM for your use-case. I don't think there is a need to create a bean.

Thanks,

Rishi

[1] https://docs.adobe.com/docs/en/cq/5-6-1/developing/scripts.print.html

Avatar

Level 3

Hi Rishi

thanks for your answer. I tried to test the solution you proposed but I get an error.

That's how my widgets.jsp looks like:

<%------------------------------------------------------------------------ ~ ~ ADOBE CONFIDENTIAL ~ __________________ ~ ~  Copyright 2014 Adobe Systems Incorporated ~  All Rights Reserved. ~ ~ NOTICE:  All information contained herein is, and remains ~ the property of Adobe Systems Incorporated and its suppliers, ~ if any.  The intellectual and technical concepts contained ~ herein are proprietary to Adobe Systems Incorporated and its ~ suppliers and may be covered by U.S. and Foreign Patents, ~ patents in process, and are protected by trade secret or copyright law. ~ Dissemination of this information or reproduction of this material ~ is strictly forbidden unless prior written permission is obtained ~ from Adobe Systems Incorporated. --------------------------------------------------------------------------%> <%-- TextBox Component --%> <%@include file="/libs/fd/af/components/guidesglobal.jsp"%> <%-- todo: In case of repeatable panels, please change this logic at view layer --%> <div class="<%= GuideConstants.GUIDE_FIELD_WIDGET%> ${guideField.multiLine ? " multiline" : ""}" style="${guide:encodeForHtmlAttr(guideField.styles,xssAPI)}"> <input type="text" id="${guideid}${'_widget'}" name="${guide:encodeForHtmlAttr(guideField.name,xssAPI)}" value="${guide:encodeForHtmlAttr(guideField.value,xssAPI)}" style="${guide:encodeForHtmlAttr(guideField.widgetInlineStyles,xssAPI)}" placeholder="${guide:encodeForHtmlAttr(guideField.placeholderText,xssAPI)}"/> <script> <c:forEach var="property" items="${guideField.properties}"> console.log("${property.key} : " + "${property.value}"); </c:forEach> </script> </div>

And this is the jsp error that is logged in the log file:

Caused by: javax.el.PropertyNotFoundException: Property 'properties' not found on type com.adobe.aemds.guide.common.GuideTextBox
    at javax.el.BeanELResolver$BeanProperties.get(BeanELResolver.java:193)
    at javax.el.BeanELResolver$BeanProperties.access$400(BeanELResolver.java:170)
    at javax.el.BeanELResolver.property(BeanELResolver.java:279)
    at javax.el.BeanELResolver.getValue(BeanELResolver.java:60)
    at javax.el.CompositeELResolver.getValue(CompositeELResolver.java:53)
    at org.apache.el.parser.AstValue.getValue(AstValue.java:97)
    at org.apache.el.ValueExpressionImpl.getValue(ValueExpressionImpl.java:186)
    at org.apache.sling.scripting.jsp.jasper.runtime.PageContextImpl.proprietaryEvaluate(PageContextImpl.java:975)
    at org.apache.jsp.apps.stzh_002daf_002dcomponents.components.stzh_002daf_005fmail_005ftextbox.widget_jsp._jspx_meth_c_005fforEach_005f0(widget_jsp.java:266)
    at org.apache.jsp.apps.stzh_002daf_002dcomponents.components.stzh_002daf_005fmail_005ftextbox.widget_jsp._jspService(widget_jsp.java:238)
    at org.apache.sling.scripting.jsp.jasper.runtime.HttpJspBase.service(HttpJspBase.java:70)
    at javax.servlet.http.HttpServlet.service(HttpServlet.java:725)
    at org.apache.sling.scripting.jsp.jasper.servlet.JspServletWrapper.service(JspServletWrapper.java:502)

Is the property you mentioned only available in Sightly?

Avatar

Level 3

properties object is exposed as part of global objects, it is not a part of guideField bean. You should try the following code in the component's jsp,

<% String hasUrlForAutocompleteLookUp = properties.get("hasUrlForAutocompleteLookUp", null); %> <% if(hasUrlForAutoCompleteLookUp != null) {%> <!-- Insert your markup here --> <% } %>

Avatar

Level 3

Thanks a lot, using the global property 'properties' it works.

adding following code to widget.jsp list all properties currently available smiley

... <script> <c:forEach var="property" items="${properties}"> console.log("${property.key} : " + "${property.value}"); </c:forEach> </script> ...

Regards,

Urs