jQuery Credit Card Validator

by @PawelDecowski

jQuery Credit Card Validator detects and validates credit card numbers. It’ll tell you the detected credit card type and whether the number length and Luhn checksum are valid for the type of card.

Demo

Try some of these numbers:

  • 4000000000000002
  • 4026000000000002
  • 501800000009
  • 5100000000000008
  • 6011000000000004

Payment details

    • Visa
    • Visa Electron
    • MasterCard
    • Maestro
    • Discover
    • or

How to use it

The function’s signature is:

.validateCreditCard( callback(result) [, options] )

So the basic usage looks like this:

$('#cc_number').validateCreditCard(function(result)
{
    alert('CC type: ' + result.card_type.name
      + '\nLength validation: ' + result.length_valid
      + '\nLuhn validation: + result.luhn_valid');
});

Or with options specified:

$('#cc_number').validateCreditCard(function(result) { ... }, { accept: ['visa', 'mastercard'] })

How it works

jQuery Credit Card Validator is written in CoffeeScript and (surprise, surprise!) is a jQuery plugin. It attaches to the input event (with a fallback to the keyup event) and, every time the number in the input field changes, it calls a function defined by you. It passes a single parameter to the function — an object with 3 properties:

The second parameter currently supports one option:

Supported card types and corresponding string descriptors

Like what you see?

Download now