CODEWITHSUNDEEP
javascriptknockout.js
Mdb
Mdb

Reputation: 8556

Knockoutjs: Change the color of selected value in dropdown list

I have a very simple dropdown populated with values from a view model. When You select 'blue' I want the color of the selected value to become blue. Is this possible?

html:

<select data-bind="options: colors,  value:  selectedColor"></select>

javascript:

var ColorsViewModel = function() {
  this.colors = ko.observableArray(['blue', 'yellow', 'pink']);
  this.selectedColor = ko.observable('blue');
};

ko.applyBindings(new ColorsViewModel());

JSFiddle: http://jsfiddle.net/2Qnv7/108/

Thanks!

Upvotes: 1

Views: 1095

Answers (1)

janfoeh
janfoeh

Reputation: 10328

Use the style binding:

<select data-bind="options: colors,  value:  selectedColor, style: {'background-color': selectedColor}"></select>

Upvotes: 2

Related Questions