Bala
Bala

Reputation: 67

How to bind a value in select box which doesn't present in content using Ember.Select

I have a list of values in content array of Ember.Select. The selected value may or may not be present in the content. But have to show the selected value if doesn't present in content.

For more details check this jsbin

In this if I click on "setColorWithNewValue", it sets the colorObj with new value that doesn't present in colorArray. When I click on "alertValue" button it shows the value in ColorObj but it doesn't selected in select box.

Upvotes: 0

Views: 47

Answers (1)

medokin
medokin

Reputation: 620

The selected object needs to be in the selection too.

When you call setColorWithNewValue, just push the new object to colorsArray and set the reference to colorObj.

setColorWithNewValue: function() {
    var newObject = { 'name': 'White', 'value': '5'};
    this.get('colorsArray').push(newObject);
    this.set('colorObj', newObject);
}

or without changing the colorsArray

mergedArray: function(){
    var arr = new Ember.A(this.get('colorsArray'));
    arr.push(this.get('colorObj'));
    return arr;
}.property('colorObj', 'colorsArray.@each')

And pass merged array to the select field.

Also look into Ember.Array and Ember.Object. Ember extends native Objects and Arrays.

Upvotes: 1

Related Questions