JSFiddle - React, Tailwind, and code Playground
HTML
The value is: <span data-bind="text: Value"></span>
<br/>
<input id="noMessage" type="text" data-bind="value: Value, initValueField: Type()" />
<input type="button" data-bind="click: changeType" value="Change Type" />
<input id="withMessage" type="text" data-bind="value: Value, initValueField: Type()" />
<input type="button" data-bind="click: changeType" value="Change Type" />
JavaScript
var viewModel = (function(){
var self = {};
self.Value = ko.observable(1);
self.Type = ko.observable('someType');
self.changeType = function() {
self.Type(Math.random());
};
ko.bindingHandlers.initValueField = {
update:function (element, valueAccessor, allBindingsAccessor, viewModel) {
if (element.id != "noMessage"){
alert('Hello World - from ' + element.id);
}
}
};
return self;
})();
ko.applyBindings(viewModel);