Click counter example

by Diya_Khan

HTML

<div> You have clicked <span data-bind='text: clicksCount'></span> times</div>
<input type="button" value="Click" data-bind="click : addClicks, disable : hasClickedTooManyTimes" />
<div data-bind="visible: hasClickedTooManyTimes">
You have clicked too many times.
<button data-bind="click: resetClicks" >Reset</button> 
</div>

JavaScript

var clickedDataModel = function(){

        this.clicksCount = ko.observable(0);

        this.addClicks = function(){
             this.clicksCount (this.clicksCount () + 1); 
        }
            
        this.hasClickedTooManyTimes = ko.computed(function() {
             return this.clicksCount () >= 3;    
        },this);

        this.resetClicks = function(){
            this.clicksCount(0);
        }    
        
}; 

ko.applyBindings(new clickedDataModel());