http://stackoverflow.com/questions/42102871/knockout-option-select-reinitializes-after-hiding-showing
by jlspake
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
Visible: <input type="checkbox" data-bind="checked: visible" />
<!-- ko 'if': visible -->
<select data-bind="options: options, optionsText: 'name', value: selectedItem"></select>
<!-- /ko -->
JavaScript
var ViewModel = function() {
this.visible = ko.observable(true);
this.options = ko.observableArray([
{name: 'A', value: 'A00'},
{name: 'B', value: 'A01'},
{name: 'C', value: 'A02'},
]);
this._selectedItem = ko.observable(this.options()[0]);
this.selectedItem = ko.computed({
read: function () {
console.log("reading value");
return this._selectedItem();
},
write: function (newSelection) {
console.log("setting value:" + newSelection.value);
this._selectedItem(newSelection);
}
}, this);
};
ko.applyBindings(new ViewModel());