Numbers get converted to strings
https://groups.google.com/d/topic/knockoutjs/SPrzcgddoY4/discussion
by rniemeyer
HTML
<script src="http://knockoutjs.com/js/jquery.tmpl.js"></script>
<script src="http://knockoutjs.com/downloads/knockout-2.2.1.js"></script>
<label>Bad: </label>
<input data-bind="value: units" size="3" />
<span data-bind="text: ko.toJSON(units)"></span>
<hr/>
<label>Good (writable dependentObservable): </label>
<input data-bind="value: units2" size="3" />
<span data-bind="text: ko.toJSON(units)"></span>
<hr/>
<label>Good (numericObservable): </label>
<input data-bind="value: units3" size="3" />
<span data-bind="text: ko.toJSON(units3)"></span>
<hr/>
JavaScript
ko.numericObservable = function(initialValue) {
var _actual = ko.observable(initialValue);
var result = ko.dependentObservable({
read: function() {
return _actual();
},
write: function(newValue) {
var parsedValue = parseFloat(newValue);
_actual(isNaN(parsedValue) ? newValue : parsedValue);
},
disposeWhenNodeIsRemoved: element
});
return result;
};
var viewModel = {
units: ko.observable(2.50),
units3: ko.numericObservable(2.50)
};
viewModel.units2 = ko.dependentObservable({
read: function() {
return this.units();
},
write: function(newValue) {
var parsedValue = parseFloat(newValue);
this.units(isNaN(parsedValue) ? newValue : parsedValue);
},
owner: viewModel
});
ko.applyBindings(viewModel);