Knockout : Toggling

by origineil

HTML

<input type='checkbox' data-bind="checked: showConfirmationMessage ">Toggle</input>
<button data-bind='click: toggle'>Toggle</button>
<div data-bind="visible: showConfirmationMessage ">
 This area is only visible when the box is checked.
</div>

JavaScript

var ViewModel = function() {
    var self = this;
    self.showConfirmationMessage = ko.observable(false)
    self.toggle = function(){
    self.showConfirmationMessage(!self.showConfirmationMessage())
    }
};

ko.applyBindings(new ViewModel());