1

I'm having an issue where I'm adding a dropdown to my search to filter through the first parent attribute in a category (Winter 2020, Spring 2021, and so on). The search field works, but nothing happens if I select from the dropdown (Winter 2020).

What am I missing?

{% set search = search ?? ''%}
{% set category = category ?? ''%}

{% set entryQuery = craft.entries ({
    search: search,
    section: 'articles',
    limit: 2, 
    }) %}


{% set myCategoryQuery = craft.categories ({
    group: 'edition', 
    level: 1,
    }) %}

{% set entries = entryQuery.all() %}
{% set categories = myCategoryQuery.all() %}



<div s-replace="#board">
<form>
    <input sprig s-trigger="keyup changed delay:200ms" id="search" name="search" value="{{ search }}" type="text" placeholder="Search" autocomplete="off">
    <select sprig name="category" id="category" value="{{ category }}" class="form-control">
      <option value="">Any</option>
        {% for category in categories %}
          <option value="{{ category }}">{{ category }}</option>
        {% endfor %}
    </select>
  </form>

    <div id="board">
        {% for entry in entries %}
        <div class="mt-4 mb-4">
          {% for category in entry.edition.all()%}
            <strong> {{ category }}</strong>
          {% endfor %}
          <div>{{entry.title}}</div>
          {% for category in entry.authors.all() %}
          {{ category.title }},
          {% endfor %}
        </div>
        {% endfor %}
        {% if entries|length == 0 %}
      <div>No entries found </div>
        {% endif %}
        <div>
      </div>
    </div>
  </div>

1

You need to apply the category filter to the entry query.

{% set categoryId = categoryId ?? '' %}

{% set entryQuery = craft.entries ({
    search: search,
    section: 'articles',
    limit: 2,
    relatedTo: categoryId,
}) %}

And also update the select field to match.

    <select sprig name="categoryId" id="category" value="{{ categoryId }}" class="form-control">
      <option value="">Any</option>
        {% for category in categories %}
          <option value="{{ category.id }}">{{ category }}</option>
        {% endfor %}
    </select>

See the Sprig filters video for an explanation of how to output and use categories as filters:
https://putyourlightson.com/sprig/videos#sprig-filters

4
  • I'm getting this error "Variable "categories" does not exist."
    – JBrew30
    May 27 at 17:22
  • Thanks for the Speedy reply. I then tried {% set entryQuery = craft.entries ({ search: search, section: 'articles', limit: 2, relatedTo: category, }) %} and the error went away but now when I select a year from the dropdown it gives me "No entries found"
    – JBrew30
    May 27 at 17:49
  • You need to update the select field to match, I updated the answer with the new code.
    – Ben Croker
    May 27 at 21:07
  • That worked! Thank you!
    – JBrew30
    May 28 at 14:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.