JSFiddle - React, Tailwind, and code Playground

by natarajgandhi

HTML

<input type="text" id="formattedNumberField" maxlength="5" value="" />

CSS

#formattedNumberField {
    border-radius: 15px;  
    border: 1px solid #8AC007;
    width: 200px;      
}

JavaScript

//jQuery
$("#formattedNumberField").on('keyup', function () {
    var boxlenght = $(this).val().length;
    if (boxlenght == 2) {
        //alert($(this).val().length);
        $(this).val($(this).val() + '-');
        //alert($(this).val().length);       
    }
});