AEM6 sightly passing through variable via template into javascript variable | Community
Skip to main content
T
TomMaton
October 16, 2015
Solved

AEM6 sightly passing through variable via template into javascript variable

  • October 16, 2015
  • 2 replies
  • 1871 views

I'm using the new sightly language in AEM6 to render my components using templates, in my component there is a video that uses the JWPlayer plugin which needs the following code to initalise the video:

<div id='playerpwSIOjcRZrCa'></div> <script type='text/javascript'> jwplayer('playerpwSIOjcRZrCa').setup({ file: '//www.youtube.com/watch?v=123456', title: 'Video title', width: '100%', aspectratio: '16:9' }); </script>

But I want to make the Youtube variable dynamic so the user can change the id within the author so have got the following template passing in the videoPath (youtube id):

<template data-sly-template.player="${@ videoPath}"> Video Id: ${videoPath} <script src="//jwpsrv.com/library/HjcD1BZoEeS7ByIAC0MJiQ.js"></script> <div id='playerpwSIOjcRZrCa'></div> <script type='text/javascript'> jwplayer('playerpwSIOjcRZrCa').setup({ file: '//www.youtube.com/watch?v=' ${videoPath}, title: 'Video title', width: '100%', aspectratio: '16:9' }); </script> </template>

The problem I'm having is the ${videoPath} in the tags is not rendering the id where as the one at the top of the template is.

Is there a way in solving this using the sightly templates?

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 Sham_HC

The variable is part of script please use context as scriptString. Details at http://docs.adobe.com/content/docs/en/aem/6-0/develop/sightly.html#Display%20Context

2 replies

Sham_HC
Sham_HCAccepted solution
Level 10
October 16, 2015

The variable is part of script please use context as scriptString. Details at http://docs.adobe.com/content/docs/en/aem/6-0/develop/sightly.html#Display%20Context

Scott_Brodersen
Scott_Brodersen
Level 8
October 16, 2015

I received this information as well about your question:

The reason we don't display expressions that are in scripts or in styles is because these two contexts cannot be made cross-site scripting safe automatically. This is why you must provide a context option for them.

 

You have the scriptToken and scriptString, respectively the styleToken and styleString contexts that should help, and worse case if they don't do what you expect you have the unsafe context.

E.g:

<div id='playerpwSIOjcRZrCa'></div> <script type='text/javascript'> jwplayer('playerpwSIOjcRZrCa').setup({ file: '//www.youtube.com/watch?v=${videoPath @ context="scriptString"}', title: 'Video title', width: '100%', aspectratio: '16:9' }); </script>

 

scott

Terms & ConditionsAccessibility statement

Loading footer...