AEM 6.4 Connect java file with HTML File

Karl515

30-01-2019

I've been reading quiet a few but still am not able to get it done.

Current Java code:

1679533_pastedImage_0.png

html code

1679558_pastedImage_1.png

Folder Structure:

1679565_pastedImage_0.png

I'm trying to read metadata (specifically) size of image in java and load it back to html.

     - I get my image via ${properties.fileReference}

     - I prefer Local, but By bundle is alright as long as explained.

------------------------------ WORKFLOW: ---------------------------------

     - Add image via

1679566_pastedImage_0.png

     - get file via ${properties.fileReference}

     - process in Java (local) (both sounds good too)

     - return width and height to .html. (ex. <div> ${javaClass.width} - ${javaClass.height} </div>

Accepted Solutions (1)

Accepted Solutions (1)

smacdonald2008

30-01-2019

See this document - we cover Granite Resource types and cover concepts like HTL/Sling Models:

Building Experience Manager Components using Granite/Coral Resource Types

I recommend that you go through the whole document too as it explains a lot of AEM Component concepts.

Also - I recommend placing your Java into a bundle - not a file in CRXDE lite.

Answers (12)

Answers (12)

Gaurav-Behl

MVP

31-01-2019

Not sure but try these -

Option#1:   aem-touch-ui-validation/pathbrowser.html at master · nateyolles/aem-touch-ui-validation · GitHub

&lt;pathbrowserD
  jcr:primaryType="nt:unstructured"
  sling:resourceType="granite/ui/components/foundation/form/pathbrowser"
  fieldLabel="Required and allow non existing path"
  fieldDescription="Try entering an external URL"
  rootPath="/content/aem-touch-ui-validation"
  required="{Boolean}true"
  allowNonRootPath="{Boolean}true"
  allowNonExistingPath="{Boolean}true"
  name="./pathbrowserD"/&gt;

If this doesn't suffice, then write custom code to forcefully delete the chosen path that doesn't belong to the restricted folder and display message to let user know pick the specific path only:

Option#2:

AEM Touch UI Dialog Validation New Best Practice: Use Foundation-Validation

Karl515

30-01-2019

Update, I got to work. after I installed the complete package then doing the steps again. Maybe I was missing some coral component reference the first time.

Karl515

30-01-2019

smacdonald2008

What's the difference between sling:resourceType that has Coral and the once that are without? btw, I've tested the link and found an error

1680300_pastedImage_2.png

Number 8 seems like a typo to me.

and followed the instructions carfully to number 34 yet it doesn't seem to reflect.

1680301_pastedImage_3.png

textfield and textarea doesn't reflect.

Gaurav-Behl

MVP

30-01-2019

Did you use  data-sly-use.<object_name>="com.adobe.cq.wcm.core.components.models.<SlingModelClass>" ?

check any core component and validate your code against it.