Knockout Example - Form Show hide panels

Show Hide controlled by checkbox

HTML

<form id='Form1'>
    Child
    <input  id='showchild' type='checkbox'
    data-bind="checked:showchild" >    </iput>
    
    <div data-bind="visible: showchild">
        Child Name: <input name="childname" /><br/>
        Child Age:  <input name="childage" /><br/>
    </div>
 </form>

CSS

div {
        padding:20px;
        border:1px solid red;
}
#showchild {
    margin-bottom:30px
}

JavaScript

function viewModel (){
        this.showchild=ko.observable(false);
    };
    var vm = new viewModel();
    ko.applyBindings(vm, document.getElementById("Form1"));