June 1, 2015 8:02 am

How to detect and validate credit card numbers in jQuery

We have received many requests from our readers about credit card validation on client side so today in this tutorial I am going to show you that how to detect and validate a credit card using a jQuery library. It will show you type of detected credit card and calculate the length of the credit card number by its type.

How to detect and validate credit card numbers in jQuery

We used jQuery Credit Card Validator library to perform this validation.


Include Library:

Create text box to get credit card number.

Initialize validation library for id=”card_number”.

Above jQuery simply add and remove class from text field to show credit card image and valid tick mark few more js codes to show Length validation and Lunh validation:

You can use this library to make client side validation to show beautiful form to your clients. Demo and free code download aided first check demo if you like it then download it.

I hope you like this simple and easy tutorial please feel free to comment below.

Author Huzoor Bux

I am Huzoor Bux from Karachi (Pakistan). I have been working as a PHP Developer from last 5+ years, and its my passion to learn new things and implement them as a practice. Basically I am a PHP developer but now days exploring more in HTML5, CSS and jQuery libraries.

Tutorial Categories:
  • Thanks for a good tutorial.. 🙂