Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

Send argument in Javascript Use API from HTML

Avatar

Level 6

I have a js file with the following code:

"use strict";
use(function () {

//var url= this.url; //line 3
var url = "http://experienceleague.adobe.com/docs/experience-manager-htl/using/htl/use-api-javascript.html?lang..."; //line 4
var getRequest = new org.apache.commons.httpclient.methods.GetMethod(url),
client = new org.apache.commons.httpclient.HttpClient(),
status = new org.apache.commons.httpclient.HttpStatus();
var info = {};
var statusCode= client.executeMethod(getRequest);
if (statusCode != 404)
info.code = true;
else
info.code = false;
return info;
});

HTML:

<template data-sly-use.item="java model path">

<sly data-sly-use.status="'myfile.js' @url='${item.url}'">

</template>

 

The above code works fine for the hard coded value of URL in JS line 4. Now if i uncomment line 3 and comment out line 4 from my JS. The code breaks.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @Shaheena_Sheikh ,

I checked the above code and I think it is because of the synchronous request in

 

http.open('HEAD', url, false);

 

If this value is false, the send() method does not return until the response is received and this might be the case parsys stops loading. If possible could you please share more details so that I can debug it?

 

Edited

To sent URL as a parameter, you should use data

 

 

<div data-sly-use.status='myfile.js' @ url=${file2.path}" data-example="${status.aFunction}" />

 

 

you can access arguments by using 'this.'

 

 

use(function () {
var url = this.url;
.
.
.
});

 

 

 

2nd method

access data variable attribute through class

 

<div class="myClass" data-sly-use.status="myfile.js" data-url="${file2.path}"> in HTML
var args= $(".myClass");
var url= args.data("url");

 

Thank you.

View solution in original post

8 Replies

Avatar

Correct answer by
Community Advisor

Hi @Shaheena_Sheikh ,

I checked the above code and I think it is because of the synchronous request in

 

http.open('HEAD', url, false);

 

If this value is false, the send() method does not return until the response is received and this might be the case parsys stops loading. If possible could you please share more details so that I can debug it?

 

Edited

To sent URL as a parameter, you should use data

 

 

<div data-sly-use.status='myfile.js' @ url=${file2.path}" data-example="${status.aFunction}" />

 

 

you can access arguments by using 'this.'

 

 

use(function () {
var url = this.url;
.
.
.
});

 

 

 

2nd method

access data variable attribute through class

 

<div class="myClass" data-sly-use.status="myfile.js" data-url="${file2.path}"> in HTML
var args= $(".myClass");
var url= args.data("url");

 

Thank you.

Avatar

Level 6

I have updated the code. Now, this part of code work, but i want to send argument to my HTL Javascript Use api function

Avatar

Community Advisor
I have updated my reply. please check

Avatar

Level 6
<sly data-sly-use.status="'myfile.js' @ url=${file2.path}"> gives me an error --> SlingException: Cannot get DefaultSlingScript: Identifier 'myfile.js' @ url=http://localhost:4502/<path> cannot be correctly instantiated by the Use API

Avatar

Level 6
And for the second code that you suggested im getting the error: SlingException: Cannot get DefaultSlingScript: org.mozilla.javascript.EcmaError: ReferenceError: "$" is not defined.

Avatar

Administrator

@MayurSatav, thank you for sharing the answer with AEM community. We need great AEM SMEs like you. Keep contributing to the AEM community. 



Kautuk Sahni