/jquery-ssn-entry

User-friendly social security number input

Primary LanguageHTML

jquery-ssn-entry

This plugin provides a user-friendly social security number input that hides part of the number upon blur.

Dependencies

  • jQuery

Setup

Add field for social security number entry...

<input id="ssn-entry" />

Add an input which will hold the SSN value for submission with a data attribute pointing to the SSN entry input...

<input class="ssn" value="123456789" data-ssn-entry-input="#ssn-entry" />

Call the ssnEntry method on the input for submission...

$(".ssn").ssnEntry();

In practice, you'll likely want to make the input for submission hidden. The SSN entry input will be automatically filled in on page load based on the value of the SSN for submission input. Thus, if you have a saved value, your entry form will be automatically setup.

Callbacks

invalidSSN

Upon blur away from the entry field, an invalidSSN event will be triggered on that entry input if the number is invalid.

$("#ssn-entry").on('invalidSSN', function(){
  alert("SSN is invalid!");
});

validSSN

Upon blur away from the entry field, a validSSN event will be triggered on that entry input if the number is valid.

$("#ssn-entry").on('validSSN', function(){
  alert("SSN looks good.");
});