How to pass a variable (not hardcoded value) to a data-sly-use statement.

[davids23429739]

Hello Guys,

I've got an issue in which I'm unable to pass a variable to a data-sly-use.

This is a small snippet of the code I have.

<div data-sly-use.info="questions-and-answers.js"  data-sly-use.questions="${'LatestQuestions' @ maxLinks=info.maxLinks}" class="nc-questions-and-answers">
  <h2 class="nc-questions-and-answers__heading">
   ${info.title}

   </h2>

</div>

Basically the first data-sly-use (questions-and-answers.js) returns an object with several properties in which one of those (maxLinks) needs to be send to the second data-sly-use. The problem is that when I tried to get the variable in the java handler I'm always getting null.

String maxLinks = get("maxLinks", String.class);

The variables maxLinks is always null.

If instead of sending `info.maxLinks` I use a hardcoded value like a string or number, I do get the correct value in the Java handler but because the maxLinks property is dynamic then I need to send it like that.

Does anyone know how to proceed here?

Thank you.

[susheel]

I am not sure if this will work. Can you try this way once.

<sly data-sly-use.info="questions-and-answers.js">
checking inifo max links: ${info.maxLinks}
    <sly data-sly-use.questions="${'LatestQuestions' @ maxLinks=info.maxLinks}" class="nc-questions-and-answers">
        <h2 class="nc-questions-and-answers__heading">
            ${info.title}
        </h2>
    </sly>
</sly>

[Feike_Visser1]

If you print out the value, what do you get?

[smacdonald2008]

Can you post all of your HTL Code so community can look at it.

[davids23429739]

I tried the solution susheel suggested but still I'm getting null.

This is the complete snippet:

HTML:

<div data-sly-use.info="nc-questions-and-answers.js"

        data-sly-use.questions="${'LatestQuestions' @ maxLinks=info.maxLinks}" class="nc-questions-and-answers">
       <h2 class="nc-questions-and-answers__heading">
             ${info.title}

        </h2>

       <ul class="nc-questions-and-answers__list" data-sly-list.question="${questions.latestQuestions}">
            <li class="nc-questions-and-answers__list-item">
                 <a href="${question.link}">
                       ${question.title}

                  </a>
            </li>
       </ul>
</div>

nc-questions-and-answers.js:

'use strict';

use([], function() {

   var title = properties.get("title", "");

   var showMore = currentNode.hasProperty("showmore") ? String(currentNode.getProperty("showmore")) : "";

   var maxLinks = currentNode.hasProperty("maxLinks") ? Number(currentNode.getProperty("maxLinks").getString()) : 5;

   return {

       title: title,

       showMore: showMore,

       maxLinks: maxLinks

  }

});

LatestQuestions:

public class LatestQuestions extends WCMUse {

   private List<Question> latestQuestions = new ArrayList<Question>();

   @Override
   public void activate() {

   try {

   // Reading properties from the Dialog
   ValueMap dialogProperties = getProperties();
   String categoryPath = dialogProperties.get("category", String.class);
   String[] tags = dialogProperties.get("tags", new String[0]);

    // Reading Parameter from slightly

    String maxLinks = get("maxLinks", String.class);

     //// maxLinks is always null!!!!

  } catch (Exception e) { }

  }

   /**
  * Getter of the sightly properties
  */
   public List<Question> getLatestQuestions() { return this.latestQuestions; }

}

[susheel]

Did you try to print the value ?
${info.maxLinks}

if yes then do you get some value or not?         

[davids23429739]

Yes the property info.maxLinks is fine, I could print it like you mentioned and I would be able to see it. maxLinks contains a number that comes from the dialog of the component.

The problems appears when trying to send it as a parameter to the java handler. I want to know if it is possible to send variables as parameters to java handlers.

Actually in my handler I can for example do the following:

getProperties.get("maxLinks", String.class);

If I do so the maxLinks property will be there not null BUT I want to retrieve it as a data-sly-use parameter because this java handler is a reusable component that several aem components use to get the latest questions and not all the components have this maxLinks property as part of the dialog properties.

[susheel]

You are passing a number and reading as string in wcmuse code

int maxLinks = get("maxLinks", Integer.class);

[davids23429739]

It's the same. Regardless of the type I want to adapt the property, it is still null.

Both get("maxLinks", Integer.class); and get("maxLinks", String.class); returns null. 

[susheel · Accepted solution]

I checked Integer.class works fine for me. Not sure why its not working for you.

Once delete /var/classes and reload the page.

You can also try this:

var maxLinks = currentNode.hasProperty("maxLinks") ? currentNode.getProperty("maxLinks").getString() : "5";

Update js code to send String to backend java

In backend you can convert to Integer

[davids23429739]

I changed the way I retrieve the value in the js rihno file based on what you proposed and now it works good!

Thank you very much susheel for keep up with me in this, I appreciate your help.