JSFiddle - React, Tailwind, and code Playground

by techie bala

HTML

<input type="text" name="" class="float-input" />
<span class="err-msg"></span>

CSS

.err-msg { font-size:small; font-style:italic; color:red; }

JavaScript

$(function(){
    
    $('.float-input').keyup(function(e){
      var entered_value = $(this).val();
      var regexPattern = /^\d{0,8}(\.\d{1,2})?$/;         
      //Allow only Number as well 0nly 2 digit after dot(.)
        
      if(regexPattern.test(entered_value)) {
          $(this).css('background-color', 'white');
          $('.err-msg').html('');
      } else {
          $(this).css('background-color', 'red');
          $('.err-msg').html('Enter a valid Decimal Number');
      }
    });
    
});