Customizable Card Number Validation Plugin with jQuery - ForceCardNumber
File Size: | 98.7 KB |
---|---|
Views Total: | 3373 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Force Banking Number is a simple-to-use jQuery plugin helps you create an user-friendly debit/credit card input with card number validation.
Features:
- Custom numbers alignment.
- Custom max length of digits.
- Custom number of digits.
- Custom character separator.
- 10+ built-in card validation rules: AmericanExpress, DinersClubCarteBlanche, JCB, Laser, VisaElectron, Visa, Dankort, InterPayment, MasterCard, Maestro, Discover
How to use it:
1. Include jQuery library and the jQuery Force Card Number plugin in the document.
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <script src="js/jquery.forceCardNumber.js"></script>
2. Create a text field for the debit/credit card input.
<input type="text" id="demo">
3. Initialize the plugin with default settings.
$("#demo").ForceCardNumber();
4. Parameters:
// Align text on input [ left | center | right ] align: 'left', // Max length for input field [Integer number], length: null, // If existe decimal part [ true | false ] separatorGroup: true, // Character for separator group [ character ] charSeparator: " ", // Number digits for group [Integer number] digitsGroup: 4, // If click in input clear field [ true | false ] clearOnClick: true, // If it is possible to cut copy paste [ true | false ] blockCutCopyPaste: true // Card list for validade [ array | string ] { AmericanExpress | DinersClubCarteBlanche | JCB | Laser | VisaElectron | Visa | Dankort | InterPayment | MasterCard | Maestro | Discover } cardsValidate: null, // Enable or disable the validation card validateCard: true,
5. Callbacks:
// Callback for card is valid [ function() {} ] onSuccessValidate: null, // Callback for card is not valid [ function() {} ] onErrorValidate: null, // Callback for keyUp [ function() {} ] onkeyUp: null
6. Pre-defined card list and regex rules.
AmericanExpress: { type: "CreditCard", regex: /^3[47]/, length: [15] }, DinersClubCarteBlanche: { type: "CreditCard", regex: /^30[0-5]/, length: [14] }, JCB: { type: "CreditCard", regex: /^35(2[89]|[3-8][0-9])/, length: [16] }, Laser: { type: "CreditCard", regex: /^6(304|7(71|0[69]))/, length: [16, 17, 18, 19] }, VisaElectron: { type: "DebitCard", regex: /^4(17500|(026|405|508|844|91[37]))/, length: [16] }, Visa: { type: "CreditCard", regex: /^4/, length: [13, 16] }, Dankort: { type: "CreditCard", regex: /^5019/, length: [16] }, InterPayment: { type: "CreditCard", regex: /^636/, length: [16, 17, 18, 19] }, MasterCard: { type: "CreditCard", regex: /^5[1-5]/, length: [16] }, Maestro: { type: "DebitCard", regex: /^(0604|5(0(18|20|38)|612|893)|6(3(04|90)|7(59|6[1-3])))/, length: [12, 13, 14, 15, 16, 17, 18, 19] }, Discover: { type: "CreditCard", regex: /^6(011|5|4[4-9]|22(12[6-9]|1[3-9][0-9]|[2-8][0-9]{2}|9[0-1][0-9]|92[0-5]))/, length: [16] },
Change logs:
v1.4 (2014-11-15)
- Added new parameter "validateCard" * Updated verify callback and arrays
2014-10-13
- Added new parameter "blockCutCopyPaste" * Added new method "destroy"
- Rename plugin to "ForceBankingCard"
This awesome jQuery plugin is developed by NelsonBN. For more Advanced Usages, please check the demo page or visit the official website.