Solved

JQuery validation additional methods - Can't get creditcardtypes to validate numbers

Posted on 2014-04-27
4
621 Views
Last Modified: 2014-04-30
Title says it all.  The regular creditcard:true method works fine but we don't process all the cards it checks, so I need to be able to restrict to Visa, MC, Amex and Discover - so I turned to the creditcardtypes method in the additionalMethods file and edited it to only check for those 4 cards.

But, it isn't validating anything - at least in the way I've edited it.  I know I'm doing something wrong but can't see what it is. I've created a test page with the issue and have attached it here.

As always, any help would be greatly appreciated.

test.php
0
Comment
Question by:saabStory
  • 2
4 Comments
 
LVL 16

Expert Comment

by:hankknight
Comment Utility
0
 
LVL 16

Assisted Solution

by:hankknight
hankknight earned 250 total points
Comment Utility
Here is a working example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
        <script type="text/javascript" src="http://jquerycreditcardvalidator.com/jquery.creditCardValidator.js"></script>
        <script type="text/javascript">
         $(document).ready(function () {
          $('#theForm').submit(function () {
           $('#ccNum').validateCreditCard(function(result){
            if(!result || !result.card_type || (result.card_type!='visa' && result.card_type!='mastercard' && result.card_type!='amex' && result.card_type=='discover' ))
              alert( 'Please enter a valid Visa, MasterCard, American Express or Discover Card Number.' )
              return false; 
            });
          });
         });
        </script>
<title></title>
</head>
<body>
<form name="theForm" id="theForm" method="post">
First Name: <input type="text" name="billingFName" id="billingFName" />&#160;&#160;<span id="billingFNameError"></span>
<br />
Card Number: <input type="text" name="ccNum" id="ccNum" />&#160;&#160;<span id="ccNumError"></span>
<br />
<input type="submit" value="Submit" />
</form>
</body>
</html>

Open in new window

0
 
LVL 52

Accepted Solution

by:
Scott Fell,  EE MVE earned 250 total points
Comment Utility
You can get the type of card just from the first couple of digits http://en.wikipedia.org/wiki/List_of_Issuer_Identification_Numbers

However, your gateway already has this built in.  If somebody enters a card type that is not on your merchant account, you will get an error code from the gateway stating this.  I wouldn't suggest relying on javascript to validate a card.  Let the gateway's api handle this.

2 Travel and entertainment and banking/financial (3*****)
2.1 American Express (34****)
2.2 JCB (35****)
2.3 American Express (37****)
2.4 38****
3 Banking and financial (4*****)
3.1 Visa (40****)
3.2 Visa (41****)
3.3 Visa (42****)
3.4 Visa (43****)
3.5 Visa (44****)
3.6 Visa (45****)
3.7 Visa (46****)
3.8 Visa (47****)
3.9 Visa (48****)
3.10 Visa (49****)
4 Banking and financial (5*****)
4.1 Mastercard (50****)
4.2 Mastercard (51****)
4.3 Insufficient Digits
4.4 Mastercard (52****)
4.5 Mastercard (53****)
4.6 Mastercard (54****)
4.7 Mastercard (55****)
4.8 Maestro and others (56****)
4.9 57****
4.10 58****
4.11 59****
5 Merchandising and banking/financial (6*****)
5.1 60****
5.2 61****
5.3 62****
5.4 China UnionPay (6200**-6250**)
5.5 6270**-6281**
5.6 63****
5.7 (64****)
5.8 Discover (65****)
5.9 66****
5.10 Maestro (67****)
5.11 (68****)
5.12 (69****)
6 Petroleum and other future industry assignments (7*****)

Open in new window

0
 

Author Closing Comment

by:saabStory
Comment Utility
You're right - I don't want to rely on Javascript solely for validity. In fact, that was one of my issues with the built in validation method - it only seems to check length - in addition to passing a lot of cards that we don't take.  I always use javascript for a quick check of each field before handing off to the server side code for a more extensive check using the plugin's remote method.

In this instance, I ended up bypassing the javascript check for this altogether and wrote my own server side check using regexes I found to check the card numbers and ranges I wanted.  It only checks length at the moment but will incorporate a luhn checker before the form is rolled out - I've just started looking for a library to use for that.

That said, I always rely on our Gateway provider for the final filter of everything.  I'm just trying to get everything as correct as possible before I send to the gateway.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Introduction Got endorsements from your clients?  Great!  There is almost nothing better than word-of-mouth advertising.  But how can you do that on the internet?  Sure you can make a page for endorsement quotations and list them all, but who is …
Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

728 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

9 Experts available now in Live!

Get 1:1 Help Now