JSFiddle - React, Tailwind, and code Playground

by brunomsilva

HTML

<script src="http://ajax.aspnetcdn.com/ajax/knockout/knockout-2.1.0.js"></script>
<div id="test">
<input type="text" data-bind="numericValue: NumberUnits" />
<input type="text" data-bind="value: NumberUnits" />
</div>

JavaScript

var handlerBuilder = function (name, originalHandler, pattern, patternSuffixReader, valueParser, valueModifier, elementInit) {
            // name - name of the handler
            // originalHandler - the original handler to be called when a value is updated
            // pattern - the pattern used to format the value
            // patternSuffixReader - function that reads the pattern suffix from the data binding settings
            // valueParser - function that parses an entered value and saves it to the model
            // elementInit - function called on initialization to initialize the elements where the binding is applied
            var h = {};

            if (valueParser) {
                // editable element
                h.init = function (element, valueAccessor, allBindingsAccessor) {
                    var eventsToCatch = ["change", "afterkeydown"];
                    var requestedEventsToCatch = allBindingsAccessor()["valueUpdate"];
                    if (requestedEventsToCatch) {
                        if (typeof requestedEventsToCatch === 'string') // Allow both individual event names, and arrays of event names
                            requestedEventsToCatch = [requestedEventsToCatch];
                        ko.utils.arrayPushAll(eventsToCatch, requestedEventsToCatch);
                        eventsToCatch = ko.utils.arrayGetDistinctValues(eventsToCatch);
                    }

                    $(element).on('focus', function () {
                        var self = this;
                        setTimeout(function () { self.select(); }, 0);
                    });
                    if (typeof (elementInit) === 'function') {
                        elementInit(element);
                    }

                    ko.utils.arrayForEach(eventsToCatch, function (eventName) {
                        var handleEventAsynchronously = false;
                        if (ko.utils.stringStartsWith(eventName, "after")) {
                    ...