I'm wanting to make a select box with an array of locations in it, and the selected location is bound to an observable. My question is: am I doing it the right way? It seems odd to me to make an observable array with the data in it, then have to bind the actual value to another variable so that I can dynamically create the select box. Is there a better way to do it?

Also, in the end I'm going to have to make 7 of these as well (one for each day of the week). How would that effect things? I'd assume my location\_id would become an `observableArray`, but would I still build the selects the same way?

Here is my (somewhat pseudo) code:

```
var TimeEntriesModel = function (locations) {
    var self = this;

    self.locations = ko.observableArray(ko.utils.arrayMap(locations, function (location) {
        return new LocationViewModel(location);
    }));

    location_id = ko.observable(434051968);
}

var LocationViewModel = function(location) {
    var self = this;

    self.location_id = location.id;
    self.location_name = location.name;
    self.location_abbrv = location.abbreviation;
}

var entriesModel = new TimeEntriesModel(locationsdata);

ko.applyBindings(entriesModel);

var locationsdata = [
    {
        "id": "434051968",
        "name": "Serbia",
        "abbreviation": "SERBIA"
    },
    {
        "id": "434051969",
        "name": "Michigan - Detroit",
        "abbreviation": "DT"
    },
    {
        "id": "434051970",
        "name": "California - Los Angeles",
        "abbreviation": "LS"
    },
    {
        "id": "434051971",
        "name": "Macedonia",
        "abbreviation": "MACEDONIA"
    }];

```

And the select:

```
<select data-bind="foreach: $root.locations, value: $root.location_id" class="form-control selectpicker" data-live-search="true">
    <option data-bind="value: location_id, text: location_name, attr: {title: location_abbrv}" ></option>
</select>

```

And a fiddle: <http://jsfiddle.net/s5nDs/>