APIs & Integrations

vLumbley
Member

HubDB Multiple Filtering is Not Working

I am trying to achieve filtering for multiple columns, and it does not seem to be working properly. I am fairly new to hubDB and would appreciate any help! Thanks!

Preview URL: http://saintleo.hs-sites.com/test-query

Code for Filtering:

<div>&nbsp;<br>&nbsp;</div>
<div class="filter-wrap">
    <div class="clear-all"><a href="/test-query?category=&degree_level=&modality=">Clear All Filters</a></div>
    <form id="form_id" method="get">
        <h3>Category</h3>
        <ul class="category-list">
            {% set cats = hubdb_table_column(676329, "category").options %}
            <li><input type="radio" name="category" id="cat_all" value="" onChange="this.form.submit()"><label for="cat_all">All School</label>
            {% for choice in cats %}
                {% set cat_list = cat_list~choice.id|list %}
                {% if choice.id == request.query_dict.category %}
                    <li><input type="radio" name="category" id="cat_{{ choice.name|lower|replace(' ', '-') }}" value="{{ choice.id }}" onChange="this.form.submit()" checked><label for="cat_{{ choice.name|lower|replace(' ', '-') }}">{{ choice.name }}</label>
                {% else %}
                    <li><input type="radio" name="category" id="cat_{{ choice.name|lower|replace(' ', '-') }}" value="{{ choice.id }}" onChange="this.form.submit()"><label for="cat_{{ choice.name|lower|replace(' ', '-') }}">{{ choice.name }}</label>
                {% endif %}
            {% endfor %}
        </ul>
        <h3>Degree Level</h3>
        <ul class="degree-list">
            {% set degs = hubdb_table_column(676329, "degree_level").options %}
            <li><input type="radio" name="degree_level" id="deg_all" value="" onChange="this.form.submit()"><label for="deg_all">All Degree Levels</label>
            {% for choice in degs %}
                {% set deg_list = deg_list~choice.id|list %}
                {% if choice.id == request.query_dict.degree_level %}
                    <li><input type="radio" name="degree_level" id="cat_{{ choice.name|lower|replace(' ', '-') }}" value="{{ choice.id }}" onChange="this.form.submit()" checked><label for="cat_{{ choice.name|lower|replace(' ', '-') }}">{{ choice.name }}</label>
                {% else %}
                    <li><input type="radio" name="degree_level" id="cat_{{ choice.name|lower|replace(' ', '-') }}" value="{{ choice.id }}" onChange="this.form.submit()"><label for="cat_{{ choice.name|lower|replace(' ', '-') }}">{{ choice.name }}</label>
                {% endif %}
            {% endfor %}
        </ul>
        <h3>Location</h3>
        <ul class="location-list">
            {% set locs = hubdb_table_column(676329, "modality").options %}
            <li><input type="radio" name="modality" id="loc_all" value="" onChange="this.form.submit()"><label for="loc_all">All Locations</label>
            {% for choice in locs %}
                {% set loc_list = loc_list~choice.id|list %}
                {% if choice.id == request.query_dict.modality %}
                    <li><input type="radio" name="modality" id="loc_{{ choice.name|lower|replace(' ', '-') }}" value="{{ choice.id }}" onChange="this.form.submit()" checked><label for="loc_{{ choice.name|lower|replace(' ', '-') }}">{{ choice.name }}</label>
                {% else %}
                    <li><input type="radio" name="modality" id="loc_{{ choice.name|lower|replace(' ', '-') }}" value="{{ choice.id }}" onChange="this.form.submit()"><label for="loc_{{ choice.name|lower|replace(' ', '-') }}">{{ choice.name }}</label>
                {% endif %}
            {% endfor %}
        </ul>
    </form>
</div>

{% set cat_queryparam = "" %}
{% if request.query_dict.category == "" %}
    {% set cat_queryparam = "" %}
    <script>$("#cat_all").prop('checked', true);</script>
{% endif %}
{% if request.query_dict.category in ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"] %}
    {% set cat_queryparam = cat_queryparam ~ "&category="~request.query_dict.category|urlencode %}
{% endif %}

{% set deg_queryparam = "" %}
{% if request.query_dict.degree_level == "" %}
    {% set deg_queryparam = "" %}
    <script>$("#deg_all").prop('checked', true);</script>
{% endif %}
{% if request.query_dict.degree_level in ["1", "2", "3", "4", "5", "6", "7"] %}
    {% set deg_queryparam = deg_queryparam ~ "&degree_level="~request.query_dict.degree_level|urlencode %}
{% endif %}

{% set loc_queryparam = "" %}
{% if request.query_dict.modality == "" %}
    {% set loc_queryparam = "" %}
    <script>$("#loc_all").prop('checked', true);</script>
{% endif %}
{% if request.query_dict.modality in ["1", "2", "3"] %}
    {% set loc_queryparam = loc_queryparam ~ "&modality="~request.query_dict.modality|urlencode %}
{% endif %}

Code for Table:

{% set table = hubdb_table_rows(676329, cat_queryparam, deg_queryparam, loc_queryparam) %}
{% if table == [] %}
    <p class='align-center'>No results found for that search. Try changing your filter and search again.</p>
{% else %}
<div class="course-table">
    <div class="course-table-header">
        <div class="course-table-row">
            <div class="course-table-cell name-cell">
                Program
            </div>
            <div class="course-table-cell">
                Program Offering
            </div>
        </div>
    </div>
    <div class="course-table-body">
        {% for row in table %}
        <div class="course-table-row {{ row['category'].name|lower|replace(' ', '-') }} {{ row['degree_level'].name|lower|replace(' ', '-') }}">
            <div class="course-table-cell name-cell">
                <a href="{{ row['overview_url'] }}">{{ row['course_name'] }}</a>
            </div>
            <div class="course-table-cell offering-cell">
                {% for content in row.modality %}
                    {% if content.id == 1 %}<a href="{{ row.overview_url }}"><img src="http://placehold.it/63x44"><br>Campus</a>{% endif %}
                {% endfor %}
            </div>
            <div class="course-table-cell offering-cell">
                {% for content in row.modality %}
                    {% if content.id == 2 %}<a href="{{ row.overview_url }}"><img src="http://placehold.it/63x44"><br>Online</a>{% endif %}
                {% endfor %}
            </div>
            <div class="course-table-cell offering-cell">
                {% for content in row.modality %}
                    {% if content.id == 3 %}<img src="http://placehold.it/63x44"><br>Education Center{% endif %}
                {% endfor %}
            </div>
        </div>
        {% endfor %}
    </div>
</div>
{% endif %}
0 Upvotes
3 Replies 3
boulter
HubSpot Product Team
HubSpot Product Team

HubDB Multiple Filtering is Not Working

Hi there, nice job on this page.

I think all you need to is concatenate the queryparms together with ‘&’. Be sure to do this before the line that calls hubdb_table_rows. If that’s not working, try printing out the query string before to confirm it looks as intended.

vLumbley
Member

HubDB Multiple Filtering is Not Working

@boulter, I have another sidetracked question that I am not sure if it’s even possible. Is it possible to pass multiple values to one parameter? In this case, for example, having multiple categories selected. etc.

vLumbley
Member

HubDB Multiple Filtering is Not Working

Thank you! That solved the issue! I can not combine all three filtering! For anyone else following this thread, I added this line at the end of the filtering code:

{% set queryparam = cat_queryparam ~ deg_queryparam ~ loc_queryparam %}

And update the hubdb_table_rows line to:

{% set table = hubdb_table_rows(676329, queryparam) %}
0 Upvotes