http://stackoverflow.com/questions/42421506/how-to-change-dropdown-value-to-previous-value-if-certain-condition-is-not-match
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>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.min.js"></script>
<div>
<Select data-bind="options: Options, optionsCaption: '', gatedValue: selectedOption, gatedValueValidator: isOptionValid">
</Select>
</div>
JavaScript
var viewModel = function(){
var self = this;
self.Options = [1, 2, 3, 4];
self.selectedOption = ko.observable();
self.selectedOption.subscribe(function(newValue){
console.log(newValue);
});
self.isOptionValid = function(value){
return (value > 2);
}
}
ko.bindingHandlers.gatedValue = {
init: function(element, valueAccessor, allBindings, viewModel, bindingContext){
//element -> value
var validator = allBindings().gatedValueValidator;
ko.utils.registerEventHandler(element, "change", function () {
var newValue = $(element).val();
var value = valueAccessor();
if(validator(newValue)){
value(newValue);
}else{
$(element).val(value()); //reset to previous value
}
});
},
update: function(element, valueAccessor, allBindings, viewModel, bindingContext){
//model -> element
var value = ko.utils.unwrapObservable(valueAccessor());
$(element).val(value);
}
}
ko.applyBindings(new viewModel());