Knockout overriding input value when you haven't specified default value
https://groups.google.com/forum/?pli=1#!topic/knockoutjs/nbYHo5In0tI
by lordfpx
HTML
<script src="//cdnjs.cloudflare.com/ajax/libs/knockout/3.0.0/knockout-min.js"></script>
<fieldset>
<label for="radio1">Cacher</label>
<input id="radio1" type="radio" checked="checked" value="cache" data-bind="checked: montrer1" />
<label for="radio2">Montrer 1</label>
<input id="radio2" type="radio" value="cache1" data-bind="checked: montrer, click: hideAndDisable" />
<label for="radio3">Montrer 2</label>
<input id="radio3" type="radio" value="cache2" data-bind="checked: montrer, click: hideAndDisable" />
</fieldset>
<fieldset>
<input type="checkbox" value="checkbox1" data-bind="checked: checkbox" />
<input type="checkbox" value="checkbox2" data-bind="checked: checkbox" />
<input type="checkbox" value="checkbox3" data-bind="checked: checkbox" />
<input type="checkbox" value="checkbox4" data-bind="checked: checkbox" />
</fieldset>
<fieldset>
<input type="text" value="ok" data-bind="value: texte" />
</fieldset>
<pre data-bind="text: ko.toJSON($root, null, 2)"></pre>
CSS
fieldset{
padding: 5px;
margin: 5px;
background: #bbb;
}
JavaScript
var viewModel = function(){
self = this;
// radio and hidden fileds
self.montrer1 = ko.observable('cache');
//self.inputCache1 = ko.observable('test1');
//self.inputCache2 = ko.observable('test2');
// new binding handler to disable some inputs...
/* self.hideAndDisable = function(data, event) {
var $thisEl = $(event.target),
formElements = $thisEl.val();
//self.inputCache1.disable;
switch (formElements) {
case ('cache'):
$thisEl.parent('fieldset').find('.cache input').prop('disabled', true);
//self.inputCache1.disable;
//self.inputCache2.disable;
break;
case ('cache1'):
//$thisEl.parent('fieldset').find('.cache1 input').prop('disabled', false);
self.inputCache1.enable;
break;
case ('cache2'):
//$thisEl.parent('fieldset').find('.cache2 input').prop('disabled', false);
self.inputCache2.enable;
break;
}
};*/
// checkbox
self.checkbox= ko.observableArray();
// input text
self.texte= ko.observable();
};
ko.applyBindings(new viewModel());