Credit card number is one of sensitive information. If credit card number stolen by some one then do lots of fraud like purchasing online, create clone of your card or sell it to someone else to make transactions online.
There are lots of way to theft credit card information for hackers and fraud persons but for organization level to stop privacy violation when asked user to make payment online and enter card information that should be masked.
Note: This example is for credit card number for debit card you can change code as per your organization need.
See Also :
- Log4j2: How to Mask Logs Personal/Confidential/SPI Information
- How to Mask JSON Confidential/Personal Information in logs :JAVA
- How to mask JAVA Object confidential/personal information in logs while Printing
- How to MASK XML Confidential/Personal Data : JAVA
- How to mask Personal/Confidential Information on web page
Credit Card Masking Example:
Here considering, account number of length 16 digits. By masking will hide digits from 7th to 12th and show rest of digits. For example, my account number is 1234567890123456 than after mask will display as 1234 56XX XXXX 3456
 |  |
HTML Changes
Create a text box on your page with below html as in attachment of download section.
Java Script/JQuery Changes
Copy below java script in your head section of page.
var originalVal;
$(document).ready(function()
{
if($('#txtCCNumber').val().length>0)
{
if($('#txtCCNumber').val().indexOf("X")==-1)
{
originalVal=$('#txtCCNumber').val();
}
maskCreditCard(this);
}
$('#txtCCNumber').blur( function(e)
{
if($('#txtCCNumber').val().indexOf("X")==-1)
{
originalVal=$('#txtCCNumber').val();
}
maskCreditCard(this);
});
$('#txtCCNumber').focus( function(e)
{
$(this).val(originalVal);
});
});
function maskCreditCard(regularCardNumber)
{
var varlen =$(regularCardNumber).val().length;
if(varlen > 16)
{
$("#error").text('Not Valid Credit Card.');
}
else
{
$("#error").text('');
var str = $(regularCardNumber).val();
var mask = varlen > 4? varlen > 5? varlen > 6 ? varlen > 7 ? varlen > 8 ? varlen > 9 ? varlen > 10 ? varlen > 11 ? varlen > 12 ?
str.substring(0,4) +' '+ str.substring(4,6) +'XX XXXX' +' '+str.substring(12)
:str.substring(0,4) +' '+ str.substring(4,6) +'XX XXXX'
:str.substring(0,4) +' '+ str.substring(4,6) +'XX XXX'
:str.substring(0,4) +' '+ str.substring(4,6) +'XX XX'
:str.substring(0,4) +' '+ str.substring(4,6) +'XX X'
:str.substring(0,4) +' '+ str.substring(4,6) +'XX'
:str.substring(0,4) +' '+ str.substring(4,6) +'X'
:str.substring(0,4) +' '+ str.substring(4,6)
:str.substring(0,4) +' '+ str.substring(4,5)
:str.substring(0) ;
$(regularCardNumber).val(mask);
}
}
Note :
This masking example is created considering standard length of text size and formatting of text field, that can vary accounding to oraganizations. If your oraganization having different format and text size modify source code according to your need.
If you are facing any issue drop a comments will try to connect as soon as possible.
Download Source code
To download the source code of this example, click on below given download link. Mask Credit Card
Drop me your questions in comments section.
References
Related Posts
Your Feedback Motivate Us
If our FacingIssuesOnIT Experts solutions guide you to resolve your issues and improve your knowledge. Please share your comments, like and subscribe to get notifications for our posts.
Happy Learning !!!
You must log in to post a comment.