CMS Development

jpineda91
Contributeur

hubDB show-all filter

Résolue

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

0 Votes
1 Solution acceptée
alyssamwilie
Solution
Expert reconnu | Partenaire solutions Elite
Expert reconnu | Partenaire solutions Elite

hubDB show-all filter

Résolue

@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

 

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;
  }    
});

 

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.

Voir la solution dans l'envoi d'origine

5 Réponses
alyssamwilie
Solution
Expert reconnu | Partenaire solutions Elite
Expert reconnu | Partenaire solutions Elite

hubDB show-all filter

Résolue

@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

 

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;
  }    
});

 

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
jpineda91
Contributeur

hubDB show-all filter

Résolue

@alyssamwilie 
Thank you so much! It worked 👍

0 Votes
alyssamwilie
Expert reconnu | Partenaire solutions Elite
Expert reconnu | Partenaire solutions Elite

hubDB show-all filter

Résolue

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

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
0 Votes
alyssamwilie
Expert reconnu | Partenaire solutions Elite
Expert reconnu | Partenaire solutions Elite

hubDB show-all filter

Résolue

@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}}';
} 

 

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
0 Votes
jpineda91
Contributeur

hubDB show-all filter

Résolue

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=.....)

0 Votes