Touch UI multifield with Image and Rich text
Hi,
I am facing a typical issue i have a component with multifield which has image and Rich text when we use this we are not able to see image working properly and is is working like a browse button.
can any one help me to solve this issue, i tried many options but not working.
please find the touch Ui .content.xml
<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:sling="http://sling.apache.org/jcr/sling/1.0" 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="nt:unstructured"
jcr:title="Experience AEM RTE Multifield"
sling:resourceType="cq/gui/components/authoring/dialog"
helpPath="en/cq/current/wcm/default_components.html#Text">
<content
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/container">
<layout
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"/>
<items jcr:primaryType="nt:unstructured">
<column
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/container">
<items jcr:primaryType="nt:unstructured">
<fieldset
jcr:primaryType="nt:unstructured"
jcr:title="Sample Dashboard"
sling:resourceType="granite/ui/components/foundation/form/fieldset">
<layout
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"/>
<items jcr:primaryType="nt:unstructured">
<column
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/container">
<items jcr:primaryType="nt:unstructured">
<pages
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/multifield"
class="full-width"
eaem-nested=""
fieldDescription="Click '+' to add a new page"
fieldLabel="URLs">
<field
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/fieldset"
name="./pages">
<layout
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/layouts/fixedcolumns"
method="absolute"/>
<items jcr:primaryType="nt:unstructured">
<column
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/container">
<items jcr:primaryType="nt:unstructured">
<text
jcr:primaryType="nt:unstructured"
sling:resourceType="cq/gui/components/authoring/dialog/richtext"
fieldLabel="Text"
name="./text"
required="{Boolean}true"
useFixedInlineToolbar="{Boolean}true">
<rtePlugins jcr:primaryType="nt:unstructured">
<edit
jcr:primaryType="nt:unstructured"
features="*" />
<findreplace
jcr:primaryType="nt:unstructured"
features="*" />
<undo
jcr:primaryType="nt:unstructured"
features="[undo,redo]" />
<format
jcr:primaryType="nt:unstructured"
features="*"/>
<subsuperscript
jcr:primaryType="nt:unstructured"
features="*"/>
<justify
jcr:primaryType="nt:unstructured"
features="*"/>
<paraformat
jcr:primaryType="nt:unstructured"
features="*">
<formats jcr:primaryType="nt:unstructured">
<paragraph
jcr:primaryType="nt:unstructured"
description="Paragraph"
tag="p"/>
<heading1
jcr:primaryType="nt:unstructured"
description="Heading 1"
tag="h1"/>
<heading2
jcr:primaryType="nt:unstructured"
description="Heading 2"
tag="h2"/>
<heading3
jcr:primaryType="nt:unstructured"
description="Heading 3"
tag="h3"/>
<heading4
jcr:primaryType="nt:unstructured"
description="Heading 4"
tag="h4"/>
<heading5
jcr:primaryType="nt:unstructured"
description="Heading 5"
tag="h5"/>
</formats>
</paraformat>
<links
jcr:primaryType="nt:unstructured"
features="*"/>
<lists
jcr:primaryType="nt:unstructured"
features="*"/>
<spellcheck
jcr:primaryType="nt:unstructured"
features="*"/>
<table
jcr:primaryType="nt:unstructured"
features="*"/>
<styles
jcr:primaryType="nt:unstructured"
features="*">
<styles jcr:primaryType="cq:WidgetCollection">
<txt-caption
jcr:primaryType="nt:unstructured"
cssName="txt-caption"
text="Caption"/>
<txt-footnote
jcr:primaryType="nt:unstructured"
cssName="txt-footnote"
text="Footnote"/>
<txt-code
jcr:primaryType="nt:unstructured"
cssName="txt-code"
text="code"/>
<black
jcr:primaryType="nt:unstructured"
text="Slate Blue"
cssName="font-slate-blue"/>
<white
jcr:primaryType="nt:unstructured"
text="White"
cssName="font-white"/>
<primary1
jcr:primaryType="nt:unstructured"
text="CTA Blue"
cssName="font-cta-blue"/>
<primary2
jcr:primaryType="nt:unstructured"
text="CTA Pink"
cssName="font-cta-pink"/>
<accent1
jcr:primaryType="nt:unstructured"
text="Cyan"
cssName="font-cyan"/>
<accent2
jcr:primaryType="nt:unstructured"
text="Teal Green"
cssName="font-teal-green"/>
<accent3
jcr:primaryType="nt:unstructured"
text="CTA Violet"
cssName="font-cta-violet"/>
<accent4
jcr:primaryType="nt:unstructured"
text="True blue"
cssName="font-true-blue"/>
<accent5
jcr:primaryType="nt:unstructured"
text="Indigo"
cssName="font-indigo"/>
<accent6
jcr:primaryType="nt:unstructured"
text="Yellow Green"
cssName="font-yellow-green"/>
</styles>
</styles>
</rtePlugins>
</text>
<image
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/fileupload"
autoStart="{Boolean}true"
class="cq-droptarget"
fieldLabel="Background Image"
fileNameParameter="./fileName"
fileReferenceParameter="./fileReference"
mimeTypes="[image]"
multiple="{Boolean}false"
name="./file"
title="Background Image"
uploadUrl="${suffix.path}"
useHTML5="{Boolean}true"/>
<altText
jcr:primaryType="nt:unstructured"
sling:resourceType="granite/ui/components/foundation/form/textfield"
fieldLabel="Alt Text"
name="./text"/>
</items>
</column>
</items>
</field>
</pages>
</items>
</column>
</items>
</fieldset>
</items>
</column>
</items>
</content>
</jcr:root>
Answers are appreciated as soon as possible.
Thanks
Prasad