"ctrl+a" And "del" Button Aren't Working With Ssn Validation Input Field

In this jsfiddle, if you try to input some numbers in the input field, then try to either 'ctrl+A' and delete what you have input, OR try to use the 'del' (delete) button, the expe

Solution 1:

In your keyup handler, only replace the input if the value has changed (which it doesn't with Ctrl-A, etc)

// SSN validation// trap keypress - only allow numbers
$('input.ssn').on('keypress', function(event){
    // trap keypressvar character = String.fromCharCode(event.which);
    if(!isInteger(character)){
        returnfalse;
    }    
});

// checks that an input string is an integer, with an optional +/- sign characterfunctionisInteger (s) {
    if(s === '-') returntrue;
   var isInteger_re     = /^\s*(\+|-)?\d+\s*$/;
   returnString(s).search (isInteger_re) != -1
}

// format SSN 
$('input.ssn').on('keyup', function(){
   var val = this.value.replace(/\D/g, '');
   var newVal = '';
   // I'm not sure what this is for, but it updates the field perhaps unnecessarily//    if(val.length > 4) {//        this.value = val;//    }if((val.length > 3) && (val.length < 6)) {
        newVal += val.substr(0, 3) + '-';
        val = val.substr(3);
    }
    if (val.length > 5) {
        newVal += val.substr(0, 3) + '-';
        newVal += val.substr(3, 2) + '-';
        val = val.substr(5);
    }
    newVal += val;
    if (this.value != newVal) { // only update the field if its content has changedthis.value = newVal;   
    }
});

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}
.error-border {
    border: 2px solid #dadada;
    border-radius: 7px;
}

.error-border:focus { 
    outline: none;
    border-color: #F00;
    box-shadow: 0010px#F00;
}

<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><divid="u22"class="ax_text_field"><inputid="u22_input"class="ssn"type="text"value=""data-label="ssn1"maxlength="11"/></div>