JSFiddle - React, Tailwind, and code Playground

by kermit77

HTML

<label>Enter Amount: </label>
<input class="Amount" type="Text" />
<br/>
<label>Enter Amount: </label>
<input class="Amount" type="Text" />

JavaScript

$('.Amount').on('change', function (e) {
		var myInput = $(e.target);
    var input = this.value;
    // Remove any non digits (including commas) to pass value to controller.
    var Amount = validateInput(input);
    // Format the string to have commas every three digits 1,000,000 for display.
    var val = numberWithCommas(Amount);
    $(myInput).val(val);

});

function numberWithCommas(str) {
    return str.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}

var validateInput = function (input) {
    input = input.toString().replace(/[^0-9]/g, "");
    /* Remove leading zeros. */
    input = input.replace(/^0+/, '');
    if (input == "")
        input = 0;
    return input;
}