knockout custom numeric binding

  • 3 Answer(s)

        The details for entering only the number is given in this link :

        Try this below code :

    <span data-bind="text: Interval" ></span>
    <input data-bind="numeric, value: Interval" />


    Answered on December 27, 2018.
    Add Comment

        Use the extender method for this to enter only the numeric .

        Strip out the non-numeric characters If the input is not a number . So non-numeric input is entered .

        Intercept the value by subscribe to the observable before it updates . Therefore do not follow the keypress. Next, Do some regex which permit to check whether the input is a number or not.


    In the HTML :

    <input type="text" data-bind="value: myNum, valueUpdate: 'afterkeyup'" />

    In the JS :

    (function(ko) {
        ko.observable.fn.numeric = function () {
            // the observable we are extending
            var target = this;
            // subscribe to the observable so we can
            // intercept the value and do our custom
            // processing.
            this.subscribe(function() {
                var value = target();
                // this will strip out any non numeric characters
                target(value.replace(/[^0-9]+/g,'')); //[^0-9\.]/g - allows decimals
            }, this);
            return target;
        function ViewModel() {
            this.myNum = ko.observable().numeric();
        ko.applyBindings(new ViewModel());
    Answered on December 27, 2018.
    Add Comment

        Try this method for custom numeric binding .

        Check this link for required information The user should  hook up the settings and on update the user should call format on the input.

    Answered on December 27, 2018.
    Add Comment

  • Your Answer

    By posting your answer, you agree to the privacy policy and terms of service.