I built a dynamic page from our hubdb.
it populates all the content, and the filter works.
HOWEVER!
on the initial page load, there is no content. It only populates after the user selects a filter or searches.
While I could pitch it as a “feature”, not a “bug”, I would like it to work as intended.
What am I missing?
{% if dynamic_page_hubdb_row %} {# this is what the detail page looks like #}<h3>{{ dynamic_page_hubdb_row.product_title }}</h3> <p>{{ dynamic_page_hubdb_row.description }}</p> <ul class="additional-content">{% for item in dynamic_page_hubdb_row.wildlife_benefits %}<li> {{ item.label }} </li>{% endfor %}</ul>{% elif dynamic_page_hubdb_table_id %} {# this is the landing page #}{# Set HubDB ID. If module.db is not defined, use a default value #}{% set db = module.db or '7928396' %}{# Set the different query parameters using submitted input for hubdb query #}{% set queryparam = [] %}{# Check if the query_dict of wildlife_benefit contains the existing options of the HubDB column and append it to the queryparam #}{% if request.query_dict.wildlife_benefit in wildlife_benefits|map('label') %} {# Set new queryparam by adding the wildlife_benefit #} {% set _ = queryparam.append("wildlife_benefit=" ~ request.query_dict.wildlife_benefit|urlencode) %}{% endif %}{# Check if the query_dict of product_title is not empty and append it to the queryparam #}{% if request.query_dict.product_title != "" %} {# Set new queryparam by adding the product_title #} {% set _ = queryparam.append("product_title__icontains=" ~ request.query_dict.product_title|urlencode) %}{% endif %}{# Get all rows of your HubDB and apply your queryparam (filter) if it's set #}{% set rows = hubdb_table_rows(db, queryparam|join('&')) %}<div> <form id="form_id" method="get"> {# Choice filter for wildlife benefits #}<div> <h4>Wildlife Benefits:</h4> <select name="wildlife_benefit" form="form_id" onChange="this.form.submit()"> <option value="show-all">Show All</option> {% set wildlife_benefits_column = hubdb_table_column(db, "wildlife_benefits") %} {% set wildlife_benefits = wildlife_benefits_column.options %} {% for benefit in wildlife_benefits %} <option {% if benefit.label == request.query_dict.wildlife_benefit %}selected="selected"{% endif %} value="{{ benefit.label }}">{{ benefit.label }}</option> {% endfor %} </select></div> {# Search filter for product title #}<div><input name="product_title" type="text" id="search-by" class="autocomplete" value="{{ request.query_dict.product_title }}" placeholder="Search by Product Title"></div> <input id="submit-button" type="submit" value="search"></form></div> <div class="plant-card-list">{# Loop through the rows that have the queryparam #}{% for row in rows %} {% if request.query_dict.wildlife_benefit == "show-all" or request.query_dict.wildlife_benefit in row.wildlife_benefits|map('label') %} <a href="{{ request.path }}/{{ row.hs_path }}"> {# Replace '/detail-page/' with your actual detail page URL #} <div class="plant-card"> <div class="plant-img"> {# Access the 'url' property of the Image object #}{% set imageUrl = row.product_images.url %}<img src="{{ imageUrl }}" alt="{{ row.product_title }} Image"> </div> <h3>{{ row.product_title }}</h3> <ul class="additional-content"> {% for benefit in row.wildlife_benefits %} <li>{{ benefit.label }}</li> {% endfor %} </ul></div></a> {% endif %} {% endfor %} </div> {% endif %}