Make sure you can select the caption when using valueAllowUnset and n…

…othing is selected.
knockout · Apr 9, 2017 · 0a1581e · 0a1581e
1 parent 4391eb9
commit 0a1581e
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/spec/defaultBindings/valueBehaviors.js b/spec/defaultBindings/valueBehaviors.js
@@ -572,6 +572,17 @@ describe('Binding: Value', function() {
                 expect(select.selectedIndex).toEqual(0);
             });
 
+            it('Should display the caption when the model value changes to undefined after having no selection', function() {
+                var observable = ko.observable('B');
+                testNode.innerHTML = "<select data-bind='options:[\"A\", \"B\"], optionsCaption:\"Select...\", value:myObservable, valueAllowUnset:true'></select>";
+                ko.applyBindings({ myObservable: observable }, testNode);
+                var select = testNode.childNodes[0];
+
+                select.selectedIndex = -1;
+                observable(undefined);
+                expect(select.selectedIndex).toEqual(0);
+            });
+
             it('Should select no option value if no option value matches the current model property value', function() {
                 var observable = ko.observable();
                 testNode.innerHTML = "<select data-bind='options:[\"A\", \"B\"], value:myObservable, valueAllowUnset:true'></select>";

diff --git a/src/binding/defaultBindings/value.js b/src/binding/defaultBindings/value.js
@@ -89,9 +89,9 @@ ko.bindingHandlers['value'] = {
                     return;
                 }
 
-                var valueHasChanged = (newValue !== elementValue);
+                var valueHasChanged = newValue !== elementValue;
 
-                if (valueHasChanged) {
+                if (valueHasChanged || elementValue === undefined) {
                     if (tagName === "select") {
                         var allowUnset = allBindings.get('valueAllowUnset');
                         ko.selectExtensions.writeValue(element, newValue, allowUnset);