In this article I will explain with an example, how to implement Indian PAN Card Number validation using Regular Expression (Regex) in jQuery.
The PAN Card Number entered in the TextBox will be validated on Button click using Regular Expression (Regex) in jQuery.
HTML Markup
The following HTML Markup consists of an HTML TextBox, SPAN and a Button.
PAN Card:
<input name="txtPANCard" type="text" id="txtPANCard" class="PAN"/>
<span id="lblPANCard" class="error">Invalid PAN Number</span>
<hr />
<input type="button" id="btnSubmit" value="Submit"/>
Validating PAN Card Number using Regular Expression in jQuery
Inside the jQuery document ready event handler, the Submit Button has been assigned a jQuery Click event handler.
When the Submit Button is clicked, the PAN Card Number TextBox is referenced and then its value is tested using a Regular Expression.
If the PAN Number format is incorrect then the Error Message SPAN element is displayed.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#btnSubmit").click(function () {
var regex = /([A-Z]){5}([0-9]){4}([A-Z]){1}$/;
if (regex.test($("#txtPANCard").val().toUpperCase())) {
$("#lblPANCard").css("visibility", "hidden");
return true;
} else {
$("#lblPANCard").css("visibility", "visible");
return false;
}
});
});
</script>
CSS Class
The following CSS classes are used.
1. PAN – It will force the letters to be UPPER case.
2. error – It will apply RED color to the error message.
<style type="text/css">
.PAN
{
text-transform: uppercase;
}
.error
{
color: Red;
visibility: hidden;
}
</style>
Screenshot
Invalid PAN Card Number
![PAN Card Number validation using jQuery and Regular Expression]()
Valid PAN Card Number
![PAN Card Number validation using jQuery and Regular Expression]()
Browser Compatibility
The above code has been tested in the following browsers.
![Internet Explorer]()
![FireFox]()
![Chrome]()
![Safari]()
![Opera]()
* All browser logos displayed above are property of their respective owners.
Demo
Downloads
