<p>I am currently working with craft. </p>

<p>I want to create a <code>filter</code> with a dropdown list that will only display the images, that are related to the selected dropdown. </p>

<p>Is that even possible?</p>

<p>What I have:</p>

<pre><code>&lt;div class="row"&gt;
    &lt;select&gt;
        {% for option in entry.selection.options %}
            &lt;option&gt;{{ option.value }}&lt;/option&gt;
        {% endfor %}
    &lt;/select&gt;
    {% for image in entry.bild %}
        &lt;div class="col s12 m6 l4"&gt;
            &lt;a data-fancybox="gallery-{{entry.slug}}" href="{{ image.url }}"&gt;&lt;img width="100%" src="{{ image.url }}"&gt;&lt;/a&gt;
        &lt;/div&gt;
    {% endfor %}
&lt;/div&gt;
</code></pre>

CC BY-SA 3.0
2018-02-12T13:07:33.103Z
We need more information how they are related? What values does the dropdown contain? Is is a size range? A related category? a date range picker? Does it has to do with the filename? (eg beginning character A, B, C)
Robin Schambach
CC BY-SA 3.0
2018-02-12T13:24:36.237Z
The image will have a value which was added to the image by field. See Screenshot [My Screenshot](https://imgur.com/KKpq93t).
The dropdown will have values like years and months (my intention was to create 2 dropdown menus and sort the images like that)

At the end it should only loop the images with like the same year: For example i will select "2017", and all images that have the selection "2017" will display
Zoruak
CC BY-SA 3.0
2018-02-12T14:40:01.367Z
Do you want to load them dynamically via ajax or during the page reload?
Robin Schambach
CC BY-SA 3.0
2018-02-12T15:20:27.343Z
Best would be via Ajax, but if its simplier to use page reload than I would choose this.
Zoruak
<assets><drop-down>
Show Images via Dropdown dynamically
# Show Images via Dropdown dynamically

(Asked by: username_0 on 2018-02-12)

I am currently working with craft. 
I want to create a filter with a dropdown list that will only display the images, that are related to the selected dropdown. 
Is that even possible?
What I have:

    
        {% for option in entry.selection.options %}
            {{ option.value }}
        {% endfor %}
    
    {% for image in entry.bild %}
        
            
        
    {% endfor %}

**Tags:** assets, drop-down
> **Comments:**
> **username_1**: We need more information how they are related? What values does the dropdown contain? Is is a size range? A related category? a date range picker? Does it has to do with the filename? (eg beginning character A, B, C)  
> **username_0**: The image will have a value which was added to the image by field. See Screenshot [My Screenshot](https://imgur.com/KKpq93t). The dropdown will have values like years and months (my intention was to create 2 dropdown menus and sort the images like that)  At the end it should only loop the images with like the same year: For example i will select "2017", and all images that have the selection "2017" will display  
> **username_1**: Do you want to load them dynamically via ajax or during the page reload?  
> **username_0**: Best would be via Ajax, but if its simplier to use page reload than I would choose this.  

---

## 0 answers

