1

Hello and thank you in advance. I have a page that lists hotels by region. On the initial load of the page I am able to render all the hotels by region in a tabbed format.

enter image description here

This part of the page works great. The problem I am having is when I try to filter these hotels by amenities. My code works for the most part, however when I try to put them in the correct region, it doesn't.

Here is the querystring along with the code if any of the amenities have been selected:

Querystring: http://kiosk.test/places-to-stay?amenities%5B%5D=accessible

Code:

                    {% if craft.app.request.getParam('amenities')|length %}

                    {# First get parameters in the URL query string. #}
                    {% set hotelQuery = craft.app.request.getParam('amenities') %}

                    {# Start an array of search parameters (relationParam) with 'and' to match ALL categories #}
                    {% set relationParam = ['and'] %}

                    {# Find categories that match the slugs in your query string... #}
                    {% for querySlug in hotelQuery %}
                        {% set hotelCategories = craft.categories.group('amenities').slug(hotelQuery) %}

                        {# And merge them into the relationParam array. #}
                        {% set relationParam = relationParam|merge([{ targetElement: [hotelCategories] }]) %}
                    {% endfor %}

                    {# Avoid passing an array with `['and']` only #}
                    {% if relationParam|length < 2 %}
                        {% set relationParam = '' %}
                    {% endif %}

                    {# setup search parameters #}
                    {% set searchParams = { relatedTo: relationParam, section: 'hotels'} %}

                    {# Find the entries #}
                    {% set entries = craft.entries(searchParams).orderby('score') %}
                {% endif %}

                {% set categories = craft.categories.group('regions') %}
                {% if craft.app.request.getParam('amenities')|length %}
                    {% set projects = craft.entries(searchParams).orderby('title') %}
                {% else %}                        
                    {% set projects = craft.entries.section('hotels').orderby('title').limit(null) %}
                {% endif %}

As you can see in the image below, the two hotels that are accessible, are listed above the tabs but my tabs are still showing all the hotels.

enter image description here

This is how I am populating the tabs:

                        {% for category in categories.relatedTo(projects).all %}
                        {% set class = "" %}
                        {% if loop.first %}
                            {% set class = "active" %}
                        {% endif %}                                           
                        <div class="tab-pane fade show {{ class }}" id="nav-{{ category.slug }}" role="tabpanel" aria-labelledby="nav-{{ category.slug }}-tab">
                            <div class="row">
                            {% for entry in projects.relatedTo(category).all() %}
                                <div class="col-sm-3 card m-3">
                                    <p><strong>{{ entry.title }} </strong></p>
                                    <p>
                                    {% if entry.address1|length %}
                                        {{ entry.address1 }}</br>
                                    {% endif %}
                                    {% if entry.address2|length %}
                                        {{ entry.address2 }}</br>
                                    {% endif %}
                                    {% if entry.phone|length %}
                                        {{ entry.phone }}</br>
                                    {% endif %}
                                    {% if entry.email|length %}
                                        {{ entry.email }}
                                    {% endif %}
                                    </p>
                                    {% set amenities = entry.amenities.all() %}
                                    {% if amenities|length %}
                                        <p><strong>Amenities</strong></p>
                                        <p>
                                        {% for amenity in amenities %}
                                            {% if loop.last %}
                                                {{ amenity.title }}
                                            {% else %}
                                                {{ amenity.title }}, 
                                            {% endif %}
                                        {% endfor %}                                            
                                        </p>
                                    {% endif %}
                                </div>
                            {% endfor %} 
                            </div>
                        </div>
                    {% endfor %}

For some reason, setting projects isn't getting just the filtered amenities. Instead it is showing all hotels even though I am writing out the hotels that having matching amenities. You can also see in the image that event the tabs have been filtered to only the hotels with matching amenities.

Don't know what I am missing in my code, but all I want to do is to see if there is a querystring, and if there is, I want to only display those hotels in the proper regions.

Thank you

Your Answer

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

Browse other questions tagged or ask your own question.