hubDB show-all filter

Developer Support CMS Development
,
1

Hi everyone,
I’m trying to add a filter on a resource library that displays all assets, here is my code:

<select name="topic">
 <option value="">View Resources By Type</option>
 <option value="show-all">Show All</option>

 {% set content_type_array = [] %}
 {% for content_type in resource_content_type|map(attribute='content_type') %}
 {% unless content_type.name in content_type_array %}
 {% unless content_type.name == null %}
 {% do content_type_array.append(content_type.name) %}
 {% endunless %}
 {% endunless %}
 {% endfor %}
 {% for item in content_type_array %}
 <option {% if request.query_dict.topic == item %} selected{% endif %}>{{ item }}</option>
 {% endfor %}
 </select>
 <script>
 jQuery('select[name="topic"]').on('change',function(){
 let topic = jQuery(this).val();
 if(topic !='') {
 document.location.href='{{module.resources_page_link.url.href}}?topic={{tag}}'+topic;
 }
 else {
 document.location.href='{{module.resources_page_link.url.href}}';
 } 
 });
 </script>

with the else{} it still adds ?topic=show-all to the URL path.

Any help is appreciated!

-Jonathan

2

@jpineda91 The value when selecting Show All isn’t empty, it’s “show-all”, so either remove the value from the Show All option or change your if statement to:

if(topic && topic != 'show-all')) {
 document.location.href='{{module.resources_page_link.url.href}}?topic={{tag}}'+topic;
} else {
 document.location.href='{{module.resources_page_link.url.href}}';
}
3

Hi @alyssamwilie
Thank you so much for your reply!
I tried updating the code with your suggestion, but when I click on the Show All option it reloads the page with the same path (?topic=…)

4

@jpineda91 Do you have a public preview link I could look at to see what’s going on?

5

@jpineda91 It looks like your module.resources_page_link.url.href variable is returning blank. When document.location.href is set to blank it just refreshes the page.

link-variable.png
link-variable.png573×235 14.7 KB

If you’re just going to be staying on the same page then I don’t think a variable is necessary you could use the location object in javascript instead.

jQuery('select[name="topic"]').on('change',function(){
 let topic = jQuery(this).val();
 let link = location.protocol + '//' + location.host + location.pathname;

 if(topic && topic != 'show-all')) {
 document.location.href = link + '?topic={{tag}}' + topic;
 } else {
 document.location.href = link;
 } 
});
6

@alyssamwilie
Thank you so much! It worked :+1: