Use Javascript with Hubl

Develop, Build & Integrate CMS Development
1

Hi everyone.

I have cloned the Search Results template to make some adjustments. Instead of searching my blogs by keyword, I want to find the input and then send that input to some Hubl code where I can display blogs with tags matching the input. For example, If I input ‘trends’ in my search, I’d like the search results page to display blogs that have trends as a tag.

I’m wondering if this is possible as in the module, the javascript is in the module.js section whereas everything else is in the HTML / Hubl section. Is there a way I can do this? See below for an example of what I’m trying to acheive:

function httpRequest(term, offset) {
var SEARCH_URL = '/_hcms/search?',
requestUrl = SEARCH_URL + searchParams + '&analytics=true',
request = new XMLHttpRequest();
request.open('GET', requestUrl, true);
request.onload = function() {
if (request.status >= 200 && request.status < 400) {
var data = JSON.parse(request.responseText);

findTags(data.searchTerm);
} else {
console.error('Server reached, error retrieving results.');
}
};
request.onerror = function() {
console.error('Could not reach the server.');
};
request.send();
}

findTags(input) {
//Here, I want to be able to somehow do a hubl function to display blogs with tags

{% related_blog_posts tags={{ TAGS FOUND IN JS CODE }} %}

}

Does anyone know if this is possible?

Thanks

2

It’s not possible to use Javascript inside HubL code as HubL is server-side code that runs before any Javascript does. You can use HubL to get url search query though.

{% related_blog_posts tags="{{ request.query_dict.term }}" %}

3

Thank you this is exactly what I was looking for