Knockout clear hiding values
by Liam Talbot
HTML
<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-3.0.0.js"></script>
<section>
<p>I want to be able to automatically clear sub-question answers. How would you handle this?</p>
<ol>
<li>Select 'Yes'</li>
<li>Select one or more types</li>
<li>Select 'No'</li>
<li>Select 'Yes'</li>
<li>I want the sub questions to be cleared of answers</li>
</ol>
<br /><br />
<div>
<p>Do you like types?</p>
<input type="radio" name="q_14_a" id="q_14_a-a" value="Yes" data-bind="checked: q_14_a" required="required" /><label for="q_14_a-a">Yes</label>
<input type="radio" name="q_14_a" id="q_14_a-b" value="No" data-bind="checked: q_14_a" /><label for="q_14_a-b">No</label>
</div>
<div data-bind="visible: q_14_a() === 'Yes'">
<p>Which types?</p>
<div class="checkbox">
<label for="q_14_1-a"><input type="checkbox" name="q_14_1" id="q_14_1-a" value="a" data-bind="checked: q_14_1" />Type a</label>
<label for="q_14_1-b"><input type="checkbox" name="q_14_1" id="q_14_1-b" value="b" data-bind="checked: q_14_1" />Type b</label>
<label for="q_14_1-c"><input type="checkbox" name="q_14_1" id="q_14_1-c" value="c" data-bind="checked: q_14_1" />Type c</label>
</div>
</div>
</section>
JavaScript
var viewModel = function () {
var self = this;
self.q_14_a = ko.observable();
self.q_14_1 = ko.observableArray();
}
ko.applyBindings(new viewModel());