http://stackoverflow.com/questions/42030918/how-do-i-make-a-knockout-custom-binding-for-textboxes-that-formats-numbers
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-debug.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout-validation/2.0.3/knockout.validation.min.js"></script>
<div>
<label>Raw value: </label><span data-bind="text: value"></span>
<br/> <br/>
<label>Formatted: </label>
<input type="text" data-bind="integerFormat: value" />
</div>
JavaScript
var viewModel = function(){
var self = this;
self.value = ko.observable(123456);
return self;
}
ko.bindingHandlers.integerFormat = {
init: function (element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
let observable = valueAccessor();
let options = allBindingsAccessor().integerFormatOptions || { thousandsSeparators: ' ' };
let initialValue = observable();
let stringFormat = (inputStr) => {
//var re = new RegExp(options.thousandsSeparators,"g");
let str = inputStr.replace(/ /g, '');
// если в строке есть что-то помимо точек, запятых, цифр
if (str !== str.replace(/[^0-9]/g, ""))
return '';
if (options.thousandsSeparators != '') {
return str.replace(/\B(?=(\d{3})+(?!\d))/g, options.thousandsSeparators);
}
return str;
}
$(element).val(observable())
$(element).on("input", function (event, b) {
event.preventDefault();
$(this).val(stringFormat($(this).val()));
});
$(element).on("keydown", function (event, b) {
// Allow: backspace, delete, tab, escape, and enter
if (event.keyCode == 46 || event.keyCode == 8 || event.keyCode == 9 || event.keyCode == 27 || event.keyCode == 13 ||
// Allow: Ctrl+A
(event.keyCode == 65 && event.ctrlKey === true) ||
// Allow: Ctrl+C
(event.keyCode == 67 && event.ctrlKey === true) ||
// Allow: Ctrl+V
(event.keyCode == 86 && event.ctrlKey === true) ||
// Allow: home, end, left, right
(event.keyCode >= 35 && event.keyCode <= 39)) {
// let it happen, don't do anything
return;
}
else {
// Ensure that it is a number and stop the keypress
...