Using image multifield as cq:include tab | Community
Skip to main content
October 16, 2015
Solved

Using image multifield as cq:include tab

  • October 16, 2015
  • 2 replies
  • 1138 views

I am following the example here: http://experience-aem.blogspot.ca/2013/12/aem-cq-56-adding-images-in-multifield.html and it works, however, I would like to make the imagemultifield its own tab that I can reuse across multiple components using "cq:include".  However, when I do this, the open dialog does not render previously saved images.  When you first add images, they appear in the DD area but after selecting "OK" in the dialog, refreshing the page, and re-opening the dialog, the images no longer appear.  The data in CRX remains correct.

Here is my image_management.xml:

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" jcr:primaryType="cq:Panel" title="Image Management"> <items jcr:primaryType="cq:WidgetCollection"> <basic jcr:primaryType="cq:Widget" title="Images" xtype="panel"> <items jcr:primaryType="cq:WidgetCollection"> <images jcr:primaryType="cq:Widget" border="{Boolean}false" hideLabel="{Boolean}true" name="./images" xtype="imagemultifield"> <fieldConfig jcr:primaryType="cq:Widget" border="{Boolean}false" hideLabel="{Boolean}true" layout="form" padding="10px 0 0 100px" xtype="imagemultifieldpanel"> <items jcr:primaryType="cq:WidgetCollection"> <image jcr:primaryType="cq:Widget" cropParameter="./imageCrop" ddGroups="[media]" fileNameParameter="./imageName" fileReferenceParameter="./imageReference" height="{Long}250" mapParameter="./imageMap" name="./image" rotateParameter="./imageRotate" sizeLimit="{Long}100" xtype="imagemultifieldsmartimage"/> </items> </fieldConfig> </images> </items> </basic> </items> </jcr:root>

I include it in my dialog.xml like so:

<?xml version="1.0" encoding="UTF-8"?> <jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:nt="http://www.jcp.org/jcr/nt/1.0" jcr:primaryType="cq:Dialog" title="Configure Settings for a Discovery Tile" xtype="dialog"> <items jcr:primaryType="cq:Widget" xtype="tabpanel"> <items jcr:primaryType="cq:WidgetCollection"> <imagemanagement jcr:primaryType="cq:Widget" path="/apps/mycompany/components/management/imagetab/image_management.infinity.json" xtype="cqinclude"/> </items> </items> </jcr:root>

When I first add images from the DAM to the multifield, they render correctly:

[img]before.jpg[/img]

But after I refresh the page, the open dialog does not show the image anymore and the DD area cannot be edited:

[img]after.jpg[/img]

Both before and after, the data is correct.  Any ideas?  I am using CQ5.6.1 and all of the other files mentioned in the blog post are unchanged..

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 Mshaji

Do you see any errors in Firebug or Chrome console? Also check errors in error.log

2 replies

MshajiCommunity AdvisorAccepted solution
Community Advisor
October 16, 2015

Do you see any errors in Firebug or Chrome console? Also check errors in error.log

October 16, 2015

I do have exactly the same issue with version 5.6.1. Sample JS is not changed, dialog exactly as in example. 

The only message I see is when closing the dialog ("OK"):

Uncaught TypeError: undefined is not a function

widgets.js:97624

CQ.undo.UndoHistory.CQ.Ext.extend.onSuccessfulFormSubmitwidgets.js:107977

CQ.form.SlingSubmitAction.CQ.Ext.extend.successwidgets.js:10916

CQ.Ext.extend.handleResponsewidgets.js:3226

handleTransactionResponsewidgets.js:3274

checkResponsewidgets.js:2234 (anonymous function)