PAN Card Number Validation Using Javascript and React

In this article,  Iam going to teach you how to do PAN card number validation using Javascript and React. There are lot of solutions across internet on this topic. But here, I will be implementing this in ES6 and React app.

What is PAN ?

PAN stands for permanent account number  is an identification number which is assigned to all the tax payers in India.

Structure of the PAN Card Number

The PAN is a 10 letter alpha numeric identifier which represents the card holder. Among 10 letters, first 5 will be alphabets, next 4 will be numeric and the 10th letter will be an alphabet. If we break it down further in detail,

• First 3 letters will be the random alphabets generated from A to Z.
• 4th letter represents the category of a tax payer. Each category has its own identification letter as below
  • A — Association of persons (AOP)
  • B — Body of individuals (BOI)
  • C — Company
  • F — Firm
  • G — Government
  • H — HUF (Hindu undivided family)
  • L — Local authority
  • J — Artificial juridical person
  • P — Individual or Person
  • T — Trust (AOP)
• 5th letter is the first letter of the individual’s surname
• The next 4 letters are a 4 digit random number under 9999
• The last(10th) letter is an alphabet which is used as a check-sum to verify the validity of that current code.

In the following code, We are going to validate whether the given number is a valid PAN number or not.

PAN Card Number Validation Using Javascript

The best possible way to validate whether the given string is a valid PAN or not is by using regular expressions. The following is the regular expression I have used to validate PAN. Using the above regex code,  I have created a function called pancardValidation in ES6 Happy Coding!