JSFiddle - React, Tailwind, and code Playground

by Czechler

HTML

<span class="input-group-addon">$</span>
<input class="form-control" id="id_step2-number_2" name="step2-number_2" type="text" data-type="number" pattern="[0-9.,]+">
<span class="input-group-addon">.00</span>

JavaScript

$(document).ready(function(){
    $("input[data-type='number']").keyup(function(event){
      // skip for arrow keys
      if(event.which >= 37 && event.which <= 40){
          event.preventDefault();
      }
      var $this = $(this);
      var num = $this.val().replace(/,/gi, "");
      var num2 = num.split(/(?=(?:\d{3})+$)/).join(",");
      console.log(num2);
      // the following line has been simplified. Revision history contains original.
      $this.val(num2);
  });
});