How can I filter selected/related entries by their categories?

Question

I have a section called "Events" and an Entries field, we'll call myEntriesField to select related entries from another channel called "Exhibitors"

On the Events page, I need to display the related Exhibitors grouped by their categories. And if there are no related Exhibitors in said Event, I need to hide the surrounding html that displays the category title etc.

I have this in my template:

        {% set theListings = entry.myEntriesField %}



        {% set thisCategory = 
             theListings.relatedTo(craft.categories.slug('the-category-i-need')) 
        %}

        {% if thisCategory | length %}
        <div class="section listings">
            <h2>Category Title</h2>
            <div class="the-listings">
            {% for theEntry in thisCategory %}
                <div class="item">
                    <h3>{{ theEntry.title }}</h3>
                    ...more entry data stuff...
                    </div>
                </div>
            {% endfor %}
            </div>
        </div>
        {% endif %}



        {% set thisOtherCategory = 
             theListings.relatedTo(craft.categories.slug('the-next-category-i-need')) 
        %}

        {% if thisOtherCategory | length %}
        <div class="section listings">
            <h2>Category Title</h2>
            <div class="the-listings">
            {% for otherEntry in thisOtherCategory %}
                <div class="item">
                    <h3>{{ otherEntry.title }}</h3>
                    ...more entry data stuff...
                    </div>
                </div>
            {% endfor %}
            </div>
        </div>
        {% endif %}

But this displaying ALL Exhibitors, grouped by their categories, rather than just the related Exhibitors selected in the Event entry.

Any ideas what I am missing here?

Answer 1

Start by looping thru each category. Say, all categories in a category group called "eventsCategories." Then find entries related to each category (if any).

{# loop through each of the categories #}
{% for category in craft.categories.group('eventsCategories') %}

  {# find the exhibitor entries that are related to both the Event entry and category #}
  {% set categoryListings = craft.entries({
    section: 'exhibitors',
    relatedTo: ['and',
      { sourceElement: entry, field: 'myEntriesField' },
      { targetElement: category, field: 'myCategoriesField' }
    ]
  }) %}

  {# Only show this category if there were any related exhibitors #}
  {% if categoryListings|length %}

    <h2>{{ category.title }}</h2>

    {% for listing in categoryListings %}
      <h3>{{ listing.title}}</h3>
    {% endfor %}

  {% endif %}
{% endfor %}

Answer 2

Craft’s |group filter can be used here.

I’m going to assume that the Categories custom field on your Exhibitor entries is called myCategoriesField.

{% set groupedListings = entry.myEntriesField.find()|group('myCategoriesField.first.title')

That will give you an array of grouped Exhibitor entries, grouped by their related category titles. For example, it might look like:

[
    'Category A Title' => [
        ExhibitorEntry1,
        ExhibitorEntry2
    'Category B Title' => [
        ExhibitorEntry3,
        ExhibitorEntry4
]

Then you can loop through the grouped entries like so:

{% for categoryTitle, listings in groupedListings %}
    <div class="section listings">
        <h2>{{ categoryTitle }}</h2>
        <div class="the-listings">
            {% for listing in listings %}
                <div class="item">
                    <h3>{{ listing.title }}</h3>
                    ...more entry data stuff...
                </div>
            {% endfor %}
        </div>
    </div>
{% endfor %}

If you want to sort the category titles alphabetically, it gets slightly more complicated, but still doable:

{# Get the list of category titles from the groupedListings keys, and sort them #}
{% set sortedCategoryTitles = groupedListings|keys|sort %}

{# Loop through the sorted category titles #}
{% for categoryTitle in sortedCategoryTitles %}

    {# Now get the listings for this category title from the groupedListings array #}
    {% set listings = groupedListings[categoryTitle] %}

    {# Now display the category and its listings like normal... #}
    <div class="section listings">
        <h2>{{ categoryTitle }}</h2>
        <div class="the-listings">
            {% for listing in listings %}
                <div class="item">
                    <h3>{{ listing.title }}</h3>
                    ...more entry data stuff...
                </div>
            {% endfor %}
        </div>
    </div>
{% endfor %}