# Create a form with multiple selects that dynamically update based off of selections?

**URL:** <https://discuss.emberjs.com/t/create-a-form-with-multiple-selects-that-dynamically-update-based-off-of-selections/4435>\
**Category:** Uncategorized\
**Created:** [March 9, 2014, 5:58pm UTC](https://discuss.emberjs.com/t/create-a-form-with-multiple-selects-that-dynamically-update-based-off-of-selections/4435 "2014-03-09T17:58:28Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![mikepmunroe](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/mikepmunroe/32/15513_2.png) [@mikepmunroe](https://discuss.emberjs.com/u/mikepmunroe)\
**Post date:** [March 9, 2014, 5:58pm UTC](https://discuss.emberjs.com/t/create-a-form-with-multiple-selects-that-dynamically-update-based-off-of-selections/4435/1 "2014-03-09T17:58:28Z")

</div>

I want to create a form with 3 selects within it. The selects will look similar to the following: ‘Please select a city’ ‘Please select an attraction’ ‘Please select a season’

I have a set of cities that contain attractions. Those attractions contain seasons.

When the user selects a city in the first select box, I want the 2 select boxes below to only have options for the city selected in the first box.

It was very easy to get the first select box working.

```
{{view Ember.Select
    content=App.cities
    optionValuePath="content.id"
    optionLabelPath="content.name"
    prompt="Please select a city"}}

```

I think I want to add an observable on the selects, but I’m not sure what I want to observe. Initially, I thought I might observe `cities`, but what I really want observe is a change in selection, so that a filter kicks off in the other selections.

Any ideas on how to proceed on adding some dynamic updating to these selects based off of a selection in the first select?

---

<div class="post-metadata">

**Author:** ![JulianLeviston](https://avatars.discourse-cdn.com/v4/letter/j/958977/32.png) [@JulianLeviston](https://discuss.emberjs.com/u/JulianLeviston)\
**Post date:** [March 9, 2014, 11:53pm UTC](https://discuss.emberjs.com/t/create-a-form-with-multiple-selects-that-dynamically-update-based-off-of-selections/4435/2 "2014-03-09T23:53:44Z")

</div>

Ah… **this** gnarly problem. 🙂 hehe. I’ve seen this quite a few times (sure you have too)!

Lets call them one, two and three.

So, you don’t seem to have bound a selection to “one” using selectionBinding=“something”. You need to do that. When you’ve got a selection value/variable set, you can then use that to inform a property of “one”'s selection - let’s call this “two’s content” (because it is). This returns an array of filtered items based on “one”'s selection.

Based on what you’ve said, I think you’ll have no trouble walking the rest of the path?

---

<div class="post-metadata">

**Author:** ![mikepmunroe](https://sea1.discourse-cdn.com/flex019/user_avatar/discuss.emberjs.com/mikepmunroe/32/15513_2.png) [@mikepmunroe](https://discuss.emberjs.com/u/mikepmunroe)\
**Post date:** [March 10, 2014, 1:13am UTC](https://discuss.emberjs.com/t/create-a-form-with-multiple-selects-that-dynamically-update-based-off-of-selections/4435/3 "2014-03-10T01:13:00Z")

</div>

Thanks, Julian. That is very helpful and I should be able to follow that along, transferring what you suggested into working code.