custom JS that's being inserted via clientlibs - how do I pass a vale to the JS?

[jayv25585659]

as above. As an example, I want to pass a property (example: ${properties.myVar}) to the javascript.

How can I do it? Thank you.

<sly data-sly-use.clientlib="/libs/granite/sightly/templates/clientlib.html"
	 data-sly-call="${clientlib.js @ categories='acme.my-custom-clientlibs-here'}"/>

In my javascript, I do something like this

alert("myVar: " + myVar);

[Rohit_Utreja]

You can populate this value in the HTML and later grab this value in JS while rendering the page.

[milind_bachani · Accepted solution]

Hi @jayv25585659 ,

You can define the variable in your html using <script> tag :

<script>
    var myVar= "${properties.myProp @ context='scriptString'}";
</script>

And the same can be accessed in JS directly using myVar.

Best,

Milind

[ayush-804]

@jayv25585659 You can specify this "myVar" value in a data-attribute of any tag and then can fetch this value in JS. Below code snippet my help: 

<div data-customValue="${myVar}" id="val"></div>

<script>
const elm= document.querySelector('#val');
alert("myVar: " + elm.dataset.customValue);
</script>

 Regards,

Ayush