Knockout Template

Knockout Template

by gurkavcu

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/2.2.1/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.3.2/knockout.mapping.min.js"></script>
<input data-bind="customData: test , v1 : test2"/>
<div>
    <span data-bind ="text : test"/>
</div>
<div>
    <span data-bind ="text : test2"/>
</div>

JavaScript

ko.bindingHandlers.customData = {
      init: function(element, valueAccessor, allBindingsAccessor, viewModel) {  
           $(element).change(function () {
                valueAccessor()(element.value);
            });       
      },
      update: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        var value =ko.utils.unwrapObservable(valueAccessor());
        var v1 = allBindingsAccessor().v1;
          if(value === "true") {
             v1("1"); 
            console.log(v1());
          }
          else  if(value === "false") {
            v1("2"); 
            console.log(v1());
          }
      }
};  


function ViewModel() {

    this.test =  ko.observable(false);
    this.test2 =  ko.observable("2");

};

$(function() {  
    
    var viewModel = new ViewModel();
    ko.applyBindings(viewModel); 
     
})