Skip to main content
Mahen_Govender
Level 2
Aug 12, 2016 10:15 AM UTC
Solved

Reading in User Input and sending through to Java Class - SIghtly / HTL

Hi All

I am trying to create a basic search component.

It is meant to take a text input from the user and on button click submit that input. It then will display the results returned.

The component as it stands looks like this:

<p>General Search Component - Mach 12</p> <div> <form> Search: <input type="search" id="searchText" name="searchText" value="THIS IS THE SEARCH TERM"><button id="searchButton">Search</button> </form> </div> <div data-sly-use.searchResults ="${'someclasspath.core.search.SearchComponent' @ searchInput= 'I NEED THE SEARCH TERM HERE' }"   data-sly-unwrap> <div class="container-fluid"> <div data-sly-list.rows = "${searchResults.searchResults}" data-sly-unwrap> <div data-sly-list.cols = "${rows}" data-sly-unwrap> <div class="col-md-3"> <div class="result"> <div>${cols.resultDate}</div> <a href="${cols.linkUrl}">${cols.title}</a> <div>${cols.description}</div> </div> </div> </div> </div> </div> </div>

How do I get the value from the input box passed to the Java Class?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
smacdonald2008
smacdonald2008Accepted solution
Level 10
Aug 12, 2016 2:09 PM UTC

Use Sightly and JavaScript to perform AJAX call. We do not have this exact use case yet (we may write it) - however - we have Sightly and JavaScript. You would need to use JavaScript AJAX call to pass the form input to a Sling Servlet that can process the input and return a result set. Here is the SIghtly and JavaScipt. 

https://helpx.adobe.com/experience-manager/using/htl_js.html

it would be similar to this - but instead of a JSP - you use Sightly front end. 

http://scottsdigitalcommunity.blogspot.ca/2013/06/posting-form-data-to-adobe-cq-using.html

PS - new name for Sightly is HTL. 

4 replies

Peter_Puzanovs
Community Advisor
Community Advisor
Aug 12, 2016 11:15 AM UTC

Hi Mahen,

You tell your form where to submit input to via the action attribute in the form element.

In Java you create a Servlet that listens on the action and reads your input.

Regards,

Peter

Translate
Mahen_Govender
Level 2
Aug 12, 2016 11:38 AM UTC

Thanks Peter!

Is there a tutorial or example you can point me to that would take me through the process?

Regards
Mahen

Translate
smacdonald2008
smacdonald2008Accepted solution
Level 10
Aug 12, 2016 2:09 PM UTC

Use Sightly and JavaScript to perform AJAX call. We do not have this exact use case yet (we may write it) - however - we have Sightly and JavaScript. You would need to use JavaScript AJAX call to pass the form input to a Sling Servlet that can process the input and return a result set. Here is the SIghtly and JavaScipt. 

https://helpx.adobe.com/experience-manager/using/htl_js.html

it would be similar to this - but instead of a JSP - you use Sightly front end. 

http://scottsdigitalcommunity.blogspot.ca/2013/06/posting-form-data-to-adobe-cq-using.html

PS - new name for Sightly is HTL. 

Translate
Mahen_Govender
Level 2
Aug 15, 2016 7:59 AM UTC

Thanks Scott :)

I will try these today, thanks for pointing me in the right direction.

Mahen

Translate