CODEWITHSUNDEEP
knockout.js
sajesh Nambiar
sajesh Nambiar

Reputation: 699

setting Dropdown default value based on condition in knockout.js

I am trying to bind dropdown with observable array and setting the selected item based on a condition but the selected value is not getting updated.

Code for the same is:

function Item(id, name) {
this.id = ko.observable(id);
this.name = ko.observable(name);
}

var viewModel = function(){
var self= this;
self.test = ko.observable('a'),
self.selectedItem = ko.computed(function () {
    var tempreview = self.test();        
    if (tempreview === "a") {
        return ko.observable("2");
    }
    else
        return ko.observable("3");

}),
self.items = ko.observableArray([new Item(3, "")])
};

var vm = new viewModel();
vm.items([new Item(1, "pencil"),
    new Item(2, "pen"),
    new Item(3, "marker"),
    new Item(4, "crayon")
]);
ko.applyBindings(vm);


<select data-bind="options: items, optionsText: 'name', optionsValue: 'id', value:selectedItem"></select>

<div data-bind="text: selectedItem"></div>

Jsfiddle link is : //jsfiddle.net/sajesh1985/c7MCh/2/

Thanks, Sajesh

Upvotes: 0

Views: 1169

Answers (1)

PatrickSteele
PatrickSteele

Reputation: 14677

In your selectedItem computed, just return '2' or '3', not an observable:

self.selectedItem = ko.computed(function () {
    var tempreview = self.test();        
    if (tempreview === "a") {
        return '2';
    }
    else
        return '3'

}),

Upvotes: 1

Related Questions