red
HTML
<script src="http://knockoutjs.com/js/knockout-2.1.0.js"></script>
<div id="formData">
Input - <input type='text' data-bind="redNegativeValue : test" /> <br />
Input - <input type='text' data-bind="test" /> <br />
Result- <span data-bind="text: test" ></span>
</div>
JavaScript
ko.bindingHandlers.redNegativeValue = {
init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
ko.bindingHandlers.value.init(element, valueAccessor, allBindingsAccessor, viewModel);
},
update: function(element, valueAccessor, allBindingsAccessor, viewModel) {
ko.bindingHandlers.value.update(element, valueAccessor, allBindingsAccessor, viewModel);
var value = valueAccessor();
var val = ko.utils.unwrapObservable(value)
if (val && val < 0) {
$(element).addClass('red');
} else {
$(element).removeClass('red');
}
}
};
viewModel = {};
viewModel.test = ko.observable(-1);
ko.applyBindings(viewModel);