Invalid value for field credit card number

Question: Q: credit card number is invalid

Posted on Jul 21, 2017 9:29 AM

All replies

Loading page content

Page content loaded

They know what type of card by the first 4 digits of the card. That is an industry standard to help eliminate fraud.

Jul 21, 2017 9:31 AM

The card type says visa up until I put in one of the digits from the last block of 4 but if I change the one number that makes it become an unknown card type to a wrong number it says that I’m using a Visa card so not sure what’s up with that

Jul 21, 2017 9:39 AM

You have likely added too many cards to your account. Apple monitors how often you switch the card associated with your account and will not let you add a new one for a couple of months. Just keep the one you already had on there or use an iTunes card.

I am certain that is the issue, assuming you have already verified that no other issue exists, with you bank.

Are you holding the card in your hand when you type? Did you try scanning? I get the sense you may not have the physical card with you.

Источник

In HTML forms, we often required validation of different types. Validate existing email, validate password length, validate confirm password, validate to allow only integer inputs, these are some examples of validation. In a certain input field, only valid credit card numbers are allowed i.e. there not allowed any other string or number which not follow the rule to be a valid credit card. We can also validate these input fields to only accept a valid credit card number using express-validator middleware.

Condition to be a valid credit card number:

Credit card number must follow the Luhn’s algorithm as shown below:

The Luhn Formula:

Example:
Original Number: 4 5 5 6 7 3 7 5 8 6 8 9 9 8 5 5
Drop the last digit: 4 5 5 6 7 3 7 5 8 6 8 9 9 8 5
Reverse the digits: 5 8 9 9 8 6 8 5 7 3 7 6 5 5 4
Multiple odd place digits by 2: 10 8 18 9 16 6 16 5 14 3 14 6 10 5 8
Subtract 9 to numbers over 9: 1 8 9 9 7 6 7 5 5 3 5 6 1 5 8
Add all numbers: 1 8 9 9 7 6 7 5 5 3 5 6 1 5 8 = 85
Mod 10: 85 modulo 10 = 5 (last digit of card)

Command to install express-validator:

Steps to use express-validator to implement the logic:

Note: Here we use local or custom database to implement the logic, the same steps can be followed to implement the logic in a regular database like MongoDB or MySql.

Example: This example illustrates how to validate an input field to only allow a valid credit card number.

Источник

Error Code 14: Invalid Card Number

Date Updated: Nov 19 2021

Caroline McMullen 2 min read

If you run a credit card and see an error code pop up, it may be error code 14. Oftentimes when you get an error code, it’s because of a problem with the credit card issuer. Depending on the situation, the error code you see may be the difference between making the sale and having to turn the customer away. One code that appears more often than not is error code 14, which denotes an invalid card number. Read on to learn more about what error codes are, what credit card error code 14 means, and how to resolve it.

What is an Error Code?

When a payment processor cannot process a transaction, they return a credit card decline code, hold code, or error code.

There are several reasons why a credit card transaction may fail to go through, each with its own corresponding code. Error codes help terminal users because they can look up the code, find out the cause of the error or decline, and use that information to figure out the best solution.

Some common causes for error codes include fraudulent activity, running a card several times in a short period, incorrect information, or other similar issues. If you accept credit and debit cards, you must arm yourself with the knowledge of how to handle error codes so you can help your customers and complete your sales.

Invalid Card Number: What Does It Mean?

You may be asking yourself, what is an error code 14? Error code 14 simply means an invalid card number was entered. It is one of the most common error codes that appear, and one of the easiest to fix. It often means the terminal user made a small mistake when keying in the card information, and one or more digits are incorrect.

The invalid number could be the actual credit card number, expiration date, zip code, or CVV. Whichever number it is, error code 14 signals it has been incorrectly entered.

How to Clear Your Error Code 14

Clearing credit card error code 14 is very easy to do. Simply re-enter the credit card number carefully and accurately, and the error code should not come up again. With the right card number, the transaction can now go through and you can complete the sale. Compared to other error codes, this is a quick fix. Many result in a customer being unable to purchase their item until they speak with their card issuer.

If your payment processor declined a transaction due to error code 14, there is no need to fret. Now you know what an error code is and just how to resolve it. With this information, you can guide your customer as you resolve the problem with ease.

Caroline is a writer and editor based in Los Angeles, CA. She has been working in the writing sphere for the last five years, covering everything from breaking news to lifestyle features, and now digital payments. Caroline is currently a Marketing Coordinator at PaymentCloud, a merchant services provider that offers hard-to-place solutions for business owners across the nation.

Источник

7 Reasons for Cash App Invalid Card Number – Fix “Invalid Card” error

A Cash App invalid card number means that the card is not valid. The bank that issued the card has apparently blocked it. If not, check if you are entering the correct Card details, CVV, name, Card is not authorized for Internet transactions, not activated and the Card is not supported by Cash App.

Does Cash App keep saying “invalid card number” each time you attempt registering your debit card in the app?

Continue reading to learn more about the topic.

Cash App is a fantastic user-friendly platform that’s great for sending and receiving funds, as well as making payments for purchases.

However, while using Cash App, you might face a Cash App “invalid card number” glitch, which is getting in your way of enjoying the amazing services the app offers. Linking your card and bank account makes it easier to fund your Cash App wallet.

This article will walk you through the reasons your card is said to be invalid. We’ll also show you what to do if you can’t link your card on the app.

So, without further ado, let’s delve in!

What Does “Invalid Card Number” Mean?

An “invalid card number” pop-up is essentially trying to tell you that your card is probably closed by the issuer.

But if the card isn’t closed, then why is Cash App saying your card number is invalid?

Why Is Cash App Saying “Invalid Card Number”?

There may be various reasons you’re unable to link your debit card to your Cash App and hence receive “invalid card number” messages. Let’s have a look at some of them.

1. The Card Is Expired

If you’re having trouble linking your debit card to Cash App, then you should check if your card has expired or not.

You may have noticed a date on the front of your debit card. That date is the expiration date of your card.

Usually, cards are valid for three to four years after the date of issue.

2. You May Be Entering the Wrong Card Details

This is a common cause of most Cash App debit card declines.

You need to enter the card details more carefully and make sure that you don’t make any errors.

Here are a few details on your card that you could be entering wrong into Cash App.

The Card Number

The card number is made up of 16 digits. Considering the number of characters, it can be very easy to swap digits while entering them.

After entering the numbers, go over them before hitting the submit button.

CVV Number

Aside from the card number, you can also enter the wrong CVV number. CVV (Credit Verification Value) is a security feature common with banking transactions.

The CVV number is a set of 3 to 4 digits normally found on the back of your card. It’s sometimes called the card verification code or a security code.

Expiry Date

Your card’s expiration date is imprinted on the front of it, written in the month/year format.

Entering the date in the right format is as important as entering the right digits.

Card Holder Name

The last detail is the card holder’s name which is boldly imprinted on the front of the card.

You shouldn’t include names that aren’t on the card, and the names must be entered in the right order, as well.

3. Your Card Isn’t Activated

If you order a new card and attempt to add the non-activated card to Cash App, the app can decline your card.

You can contact your bank to guide you through the activation process or when you run into any glitches while doing so.

4. Cash App Doesn’t Support Your Card

Cash App doesn’t accept PayPal, business debit, or ATM cards. Therefore, you’ll be sent an “invalid card number” notification if you try to link cards from these providers.

5. You Have Linked the Wrong Bank Account

Linking the wrong bank account may be another reason Cash App is stopping you from going through with your card linking process.

Make sure you have linked the bank account connected to your debit card before you attempt to register the card in the app.

6. Your Card Isn’t Authorized for Internet Transactions

Cash App can also decline your card if it hasn’t been authorized for a particular type of internet transaction.

For example, some cards are only allowed to be used for specific transactions like healthcare. If that may be the problem, then contacting your bank about it is the best option.

7. Your Application Is Outdated

Cash App might give you the “invalid card number” message if the app’s version is outdated. So make sure to update Cash App on your device.

After you update your Cash App version, clear the app’s cache and data using the following steps:

If you’ve tried everything and the issue persists, the next thing to do is to contact your bank. It might have a solution to your problem.

However, if the bank tells you that everything is clear from its side, then your only option is to contact Cash App Support.

How to Contact Cash App Support

You can contact Cash App through the application by visiting the “Support” section. The following steps will help you:

You can also reach Cash App by calling 1(800) 969-1940.

Last Words

There are many features and services available to explore on Cash App. However, you may also face issues like linking your card, among many others.

In all, we learned what it means when we get an “invalid card number” message from Cash App.

We have also explained the actions and inactions that can cause Cash App to decline our cards and how we can fix them.

Источник

Why do I see ‘Invalid Credit Card Number’ when trying to enter a credit card or pay my bill?

Issue

Your invoice payment has been declined and you are receiving the message ‘Invalid Credit Card Number’ on your Dashboard.

Resolution

When you select Pay Now in the Billing section of your Dashboard, you may receive the message Invalid Credit Card Number. This indicates a problem with the information entered for the card. Double-check the credit card number, expiration date, and CVV. If you haven’t already, also ensure that the card has been activated.

Billing address (AVS) discrepancies will not usually cause this error message. However, if the card is from outside of the US, you may be receiving this error message due to address formatting. Pay close attention to the way you enter your billing address differs from the way it appears on your statement your bank. This includes ensuring the separation of Line 1 and Line 2 of the address.

Alternatively, some banking institutions may be screening vendors like Heroku for security reasons and blocking the transaction. In this case, we recommend speaking to your bank about allowing Heroku transactions to be accepted.

Please view our knowledge base article on card declines for more information:

Ask on Stack Overflow

Engage with a community of passionate experts to get the answers you need

Heroku Support

Create a support ticket and our support experts will get back to you

Источник

Credit Card Number Validation Using jQuery

Today we are going to understand, how to do credit card number validation using jQuery. Most of the eCommerce website use transaction via credit card. Than you always need credit card number validation at client side.

We are using an HTML form to validate credit card input data. When user submit information via form than the jQuery code will be called to validate it.

For this validation we are using jQuery Credit Card Validator library. This library will detect credit card type, length and validate the card type.

How jQuery Credit Card Validator Plugin Works:

jQuery Credit Card Validator is a jQuery plugin which will take input as a card number returns an object with four properties. Check out below object properties explanation:

– card_type — Return an object with described below properties, or null if card type unknown

– valid — Return true if the number is valid, otherwise gives false
– length_valid — Return true value if the card number length is valid, false otherwise
– luhn_valid — Return true if the Luhn checksum is correct, otherwise false

Include jQuery & Credit Card Validator Library:

Include the jQuery library in HTML form page.

Include the Credit Card Validator jQuery library to validate card number.

Now write down an HTML form code to take credit card input. Initialize the input card number text by for validation library.

Источник

Cybersource Developer Community Cybersource Developer Community

We encountered the following error in our production logs:

Result code: null; Message: The field length is invalid for Card Number.

Our UI validation enforces the credit card length to be between 13 and 16 characters, as documented on the authorize.net website.

Are there additional validations performed on the payment gateway side when an account is in PRODUCTION mode compared to a TEST account? Do we have to match the length of the credit card to the credit card type? For example, if a customer has a VISA card, but enters less than 16 characters, does that throw the above exception? If so, shouldn’t it be the same in a TEST account?

Any help is greatly appreciated.

VISA, for instance, always starts with a 4 and always has 16 digits.

I entered the test VISA card number I received from Authorize.Net when I signed up for a test account. The card number is 13 digits long and I was able to create an account in CIM.

Then, I used the same card number, but added a «9» at the end. So the card number length was 14 digits and it still worked.

Looks like it doesn’t match the card type to the card number length. However, could there be a difference between a test account and a production account? Are production accounts stricter in verifying valid cards / types?

There are multiple ways we validate the card number, but the length is not one of them because it is not formally specified by the card companies. Every Visa card you ever see may be 16 digits, but there is nothing in their standards that says a 15 digit Visa is absolutely invalid.

We primarily validate the following:

1. We perform a mod-10 mathematical check on the card number to confirm that it at least has the possibility of being valid.

2. We confirm that the bin number (first 6 digits of the card) is valid and assigned to one of our supported card types. It is the BIN number that tells us the card type.

Things that are validated on production accounts are the card number (making sure its valid), expiration date (needs to be a future date), the card code and address—both will be verified if your settings are set to check this (Merchant Interface-Account tab-Security Settings- you will see AVS and Card Code Settings). You do not need to match the length of the credit card to the card type because you don’t need to pass the card type—it is automatically determined based on the credit card number entered.

Источник

braintree/card-validator

Use Git or checkout with SVN using the web URL.

Work fast with our official CLI. Learn more.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching Xcode

If nothing happens, download Xcode and try again.

Launching Visual Studio Code

Your codespace will open once ready.

There was a problem preparing your codespace, please try again.

Latest commit

Git stats

Files

Failed to load latest commit information.

README.md

Credit Card Validator

Credit Card Validator provides validation utilities for credit card data inputs. It is designed as a CommonJS module for use in Node.js, io.js, or the browser. It includes first class support for ‘potential’ validity so you can use it to present appropriate UI to your user as they type.

A typical use case in a credit card form is to notify the user if the data they are entering is invalid. In a credit card field, entering “411” is not necessarily valid for submission, but it is still potentially valid. Conversely, if a user enters “41x” that value can no longer pass strict validation and you can provide a response immediately.

Credit Card Validator will also provide a determined card type (using credit-card-type). This is useful for scenarios in which you wish to render an accompanying payment method icon (Visa, MasterCard, etc.). Additionally, by having access to the current card type, you can better manage the state of your credit card form as a whole. For example, if you detect a user is entering (or has entered) an American Express card number, you can update the maxlength attribute of your CVV input element from 3 to 4 and even update the corresponding label from ‘CVV’ to ‘CID’.

Using a CommonJS build tool (browserify, webpack, etc)

var valid = require(‘card-validator’);

valid.number(value: string, [options: object]): object

You can optionally pass luhnValidateUnionPay as a property of an object as a second argument. This will override the default behavior to ignore luhn validity of UnionPay cards.

You can optionally pass maxLength as a property of an object as a second argument. This will override the default behavior to use the card type’s max length property and mark any cards that exceed the max length as invalid.

If a card brand has a normal max length that is shorter than the passed in max length, the validator will use the shorter one. For instance, if a maxLength of 16 is provided, the validator will still use 15 as the max length for American Express cards.

A fake session where a user is entering a card number may look like:

valid.cardholderName(value: string): object

The cardholderName validation essentially tests for a valid string greater than 0 characters in length that does not look like a card number.

If a cardholder name is comprised of only numbers, hyphens and spaces, the validator considers it to be too card-like to be valid, but may still be potentially valid if a non-numeric character is added. This is to prevent card number values from being sent along as the cardholder name but not make too many assumptions about a person’s cardholder name.

If a cardholder name is longer than 255 characters, it is assumed to be invalid.

valid.expirationDate(value: string|object, maxElapsedYear: integer): object

The maxElapsedYear parameter determines how many years in the future a card’s expiration date should be considered valid. It has a default value of 19, so cards with an expiration date 20 or more years in the future would not be considered valid. It can be overridden by passing in an integer as a second argument.

expirationDate will parse strings in a variety of formats:

valid.expirationMonth(value: string): object

valid.expirationYear(value: string, maxElapsedYear: integer): object

expirationYear accepts 2 or 4 digit years. 16 and 2016 are both valid entries.

The maxElapsedYear parameter determines how many years in the future a card’s expiration date should be considered valid. It has a default value of 19, so cards with an expiration date 20 or more years in the future would not be considered valid. It can be overridden by passing in an integer as a second argument.

valid.cvv(value: string, maxLength: integer): object

The cvv validation by default tests for a numeric string of 3 characters in length. The maxLength can be overridden by passing in an integer as a second argument. You would typically switch this length from 3 to 4 in the case of an American Express card which expects a 4 digit CID.

valid.postalCode(value: string, [options: object]): object

The postalCode validation essentially tests for a valid string greater than 3 characters in length.

You can optionally pass minLength as a property of an object as a second argument. This will override the default min length of 3.

Custom Card Brands

We use nvm for managing our node versions, but you do not have to. Replace any nvm references with the tool of your choice below.

Источник

Validating and Formatting Payment Card Text Fields in Flutter

I am going to walk us through the steps of validating payment (debit/credit) cards number, expiry date and CVV. Among other things, this is basically building on the already existing features of the TextFormField widget.

We’ll start with the card number: it will be validated and the appropriate icon of the issuer displayed.

Before, you continue, please make sure you know how to validate forms in Flutter.

Validating Payment Card Number, Determining its Issuer and Formatting the Text Field

Payment card numbers might appear random, but they actually follow a certain pattern. The length varies from 8 to 19 digits and while the authenticity of these numbers can be verified using the Luhn algorithm, the first six digits can be used to determine the card issuer. For example, numbers starting with 4 are issued by Visa while those issued by Verve starts from 5060, 5061, 5078, 5079, or 6500. You can check this Wikipedia page for the full article.

We’ll create an enumeration of all the card types we wish to support. For example purposes, I keep it down to just three viz. Verve, MasterCard and Verve.

We’ll also create a class to hold the fields of the card:

Now, we’ll create a TextFormField for entering the card number.

This function uses CardUtils.getCardTypeFrmNumber to determine the card issuer from the number already entered by the user.

CardUtils.getCleanedNumber uses regex to remove any non-digit from the inputted number. Confused? You thought that’s what WhitelistingTextInputFormatter. digitsOnly is supposed to do, right? I will explain later.

CardUtils.getCardTypeFrmNumber too uses regex to match the starting characters of the number against a pre-determined set of numbers:

After determining the card issuer, we use:

to update the widget state.

3. Next, CardUtils.getCardIcon returns the appropriate issuer icon. By now, you should have added image assets of the card types you’re supporting. Now, we’ll write a switch statement to check for the card types and return the appropriate widget.

In my project, images live in projectDirectory/assets/images.

5. The actual validation is done in validator. We’ll pull off this validation with Luhn’s algorithm:

To learn more about Luhn’s Algorithm and how it works, please check this stackoverflow answer.

Formatting Card Number Text Field

To improve readability, we can format the TextFormField to automatically add double spaces after every fourth character inputted by the user. Remember inputFormatters I talked about earlier? We will extend TextInputFormatter and add an instance of it to the list of inputFormatters we already have.

It’s pertinent to note that the extra characters added doesn’t add the length of the characters counted by LengthLimitingTextInputFormatter.

So inputFormatters for the TextFormField now becomes:

How to Validate Payment Card Expiry Date and Format the Text Field.

A valid expiry card is one whose month is from 1 to 12 (i.e. January to December) and whose year is not negative. Also, an unexpired date should be the be latter than this month or year. We should keep this in mind while validating the expiry date.

That’s the nitty-gritty of the TextFormField for inputting expiry month.

Part of the for loop is the only difference.

3. CardUtils.validateDate actually checks that the expiry date is valid and has not expired.

How to Validate Payment Card CVV and Format the TextField.

This is the simplest. Payments cards CVV is either 3 or 4 digits. It can’t be less/more than that.

CardUtils.validateCVV is quite straight forward. We just ensure that the value entered by the user is not empty and it’s not less than 3 or more than 4 digits:

Wrapping it all up

For easier validation, all the TextFormFields should be children of the Form widget.

Then throw in a button that does nothing but call _validateInputs :

I have pushed a project that you can clone and test out the above features. I also added support for more payments cards like Discover, American Express, Diners Club, and JCB.

Источник

Validate a Credit Card Number with Functional JavaScript

Credit card companies are responsible for a high volume of highly sensitive global network traffic per minute with no margin for error. These companies need to ensure they are not wasting resources processing unnecessary requests. When a credit card is run, the processor has to look up the account to ensure it exists, then query the balance to ensure the amount requested is available. While an individual transaction is cheap and small, the scales involved are enormous.
There were 39.2 million transactions per day in the UK alone in 2016. The linked analysis projects 60 million for that region by 2026. Clearly, anything that can reduce load is necessary to explore.

This is a beginner-level post. Some familiarity with JavaScript is assumed but not necessarily functional programming.

What’s In A Number

At a glance, a credit card number just appears to be a sequence of digits. You may have noticed that the major processing providers have their own prefixes. Visa cards all start with a 4, MasterCard with 5, Discover with 6, and American Express are 3 (and 15 digits instead of 16). Further, financial institutions will have their own 4-6 digit prefixes. People who work at point of sale systems or are otherwise involved with financial processing will notice these patterns quickly. For example, Discover credit cards start with 6011, a 4117 will be a Bank of America debit card, and 5417 is Chase Bank. This is known as the BIN, or Bank Identification Number. There’s a large list here.

However, this is all a network routing concern, and still adds to the network’s load to resolve. To try to ensure all lookup requests actually correspond to real accounts, all numbers have a checksum built in, which is a means of detecting errors in data. A credit card number consists of your card provider’s BIN attached to your individual account number, but the final digit is a checksum digit which can be used to validate for errors without ever querying a server.

Protip

«I’m a BIN and routing number encyclopedia» is a terrible party icebreaker. If you’ve really gotta flex this side of you, ease in with zipcodes or something first. Read the room.

Luhn algorithm

The specific type of checksum is called the Luhn formula, US Patent 2,950,048 (but public domain since 1977). To validate a number via the Luhn algorithm, you add a check digit. Then, after performing the formula on the original number, you see if this check digit corresponds to your result.

Split the full number into individual digits.

Start with the rightmost excluding the check digit and double every second, moving left.

If any of those doubled digits ended up greater than 9, add the digits together (or subtract 9, if that’s your jam).

Take the sum of all the digits and the check digit.

If the total modulo 10 equals 0, the number is valid.

For an example, the number 4012-8888-8888-1881 is a valid Visa-formatted account number, used for testing. You can’t charge it, but it should validate with this algorithm.

Is it a multiple of 10? Yep!

This number checks out, it could possibly be a valid Visa card so we’re clear to make the network request.

Implement

To follow along, you’ll need Node. I’m using pnpm, feel free to use npm or yarn instead. Create a new project:

Exit fullscreen mode

Throw a stub into index.js to get hooked up:

Exit fullscreen mode

Unit tests

Before hopping into the implementation, it’s a good idea to have some unit tests ready to go. Add mocha :

Exit fullscreen mode

Exit fullscreen mode

Now add the following tests to test/test.js :

Exit fullscreen mode

Don’t worry, those aren’t real accounts, just some valid test numbers from here.

As expected, running npm test should confirm that our stub has some work to do:

Exit fullscreen mode

I’m sticking to a functional style for this implementation, wherein instead of mutating state and looping we’ll get to the final result by defining transformations over data.

Split Digits

Exit fullscreen mode

The regular expression uses ^ to match anything that isn’t a digit from 0-9. The trailing g indicates we want to match globally and replace all matches found with nothing (removing it from the string). If omitted, only the first match is replaced and the remaining string is untouched. Then, we split into individual characters, one per digit, and convert them all from characters to numeric values.

Set The Stage

Exit fullscreen mode

To get to our final validation, we’re going to perform a series of transformations on this digit array to reduce it to a final total. A valid number will produce a result that’s a multiple of 10:

Exit fullscreen mode

Get The Total

We already talked this through in English. Let’s take a stab in pseudocode:

Exit fullscreen mode

We’ve got to do that doubling step on the correct numbers in the account number, then transform anything that ended up with multiple digits, then get the total of everything together.

For this step, we can use Array.prototype.slice() to get a subset of the digits array that has everything except for the check digit. Going right-to-left can be achieved with Array.prototype.reverse() :

Exit fullscreen mode

Exit fullscreen mode

Define Transformations

Exit fullscreen mode

This works somewhat like the ternary operator but as a function. Each instance of this is just a specified case of a conditional transform:

Exit fullscreen mode

Wrapping Up

Putting it all together:

Exit fullscreen mode

Check it out with pnpm test :

Exit fullscreen mode

This algorithm is used for a variety of different types of data verification, not just credit card numbers. Maybe you could integrate it into your next project’s design! Adding a checksum to your DB keys can help protect against data transmission errors, and very simple verification like this is easy to get started with.

Challenge

Extend this code to provide a method that can add a correct Luhn checksum to any arbitrary number. The check digit will be the number you need to add to your total to get to multiple of 10.

Источник

Credit Card Validator

Credit Card Validator provides validation utilities for credit card data inputs. It is designed as a CommonJS module for use in Node.js, io.js, or the browser. It includes first class support for ‘potential’ validity so you can use it to present appropriate UI to your user as they type.

A typical use case in a credit card form is to notify the user if the data they are entering is invalid. In a credit card field, entering “411” is not necessarily valid for submission, but it is still potentially valid. Conversely, if a user enters “41x” that value can no longer pass strict validation and you can provide a response immediately.

Credit Card Validator will also provide a determined card type (using credit-card-type). This is useful for scenarios in which you wish to render an accompanying payment method icon (Visa, MasterCard, etc.). Additionally, by having access to the current card type, you can better manage the state of your credit card form as a whole. For example, if you detect a user is entering (or has entered) an American Express card number, you can update the maxlength attribute of your CVV input element from 3 to 4 and even update the corresponding label from ‘CVV’ to ‘CID’.

Download

Example

Using a CommonJS build tool (browserify, webpack, etc)

var valid = require(‘card-validator’);

valid.number(value: string, [options: object]): object

You can optionally pass luhnValidateUnionPay as a property of an object as a second argument. This will override the default behavior to ignore luhn validity of UnionPay cards.

You can optionally pass maxLength as a property of an object as a second argument. This will override the default behavior to use the card type’s max length property and mark any cards that exceed the max length as invalid.

If a card brand has a normal max length that is shorter than the passed in max length, the validator will use the shorter one. For instance, if a maxLength of 16 is provided, the validator will still use 15 as the max length for American Express cards.

A fake session where a user is entering a card number may look like:

valid.cardholderName(value: string): object

The cardholderName validation essentially tests for a valid string greater than 0 characters in length that does not look like a card number.

If a cardholder name is comprised of only numbers, hyphens and spaces, the validator considers it to be too card-like to be valid, but may still be potentially valid if a non-numeric character is added. This is to prevent card number values from being sent along as the cardholder name but not make too many assumptions about a person’s cardholder name.

If a cardholder name is longer than 255 characters, it is assumed to be invalid.

valid.expirationDate(value: string|object, maxElapsedYear: integer): object

The maxElapsedYear parameter determines how many years in the future a card’s expiration date should be considered valid. It has a default value of 19, so cards with an expiration date 20 or more years in the future would not be considered valid. It can be overridden by passing in an integer as a second argument.

expirationDate will parse strings in a variety of formats:

valid.expirationMonth(value: string): object

valid.expirationYear(value: string, maxElapsedYear: integer): object

expirationYear accepts 2 or 4 digit years. 16 and 2016 are both valid entries.

The maxElapsedYear parameter determines how many years in the future a card’s expiration date should be considered valid. It has a default value of 19, so cards with an expiration date 20 or more years in the future would not be considered valid. It can be overridden by passing in an integer as a second argument.

valid.cvv(value: string, maxLength: integer): object

The cvv validation by default tests for a numeric string of 3 characters in length. The maxLength can be overridden by passing in an integer as a second argument. You would typically switch this length from 3 to 4 in the case of an American Express card which expects a 4 digit CID.

valid.postalCode(value: string, [options: object]): object

The postalCode validation essentially tests for a valid string greater than 3 characters in length.

You can optionally pass minLength as a property of an object as a second argument. This will override the default min length of 3.

Custom Card Brands

Design decisions

Development

We use nvm for managing our node versions, but you do not have to. Replace any nvm references with the tool of your choice below.

Источник

List of Credit Card Declined Codes – Error Codes Explained

Declined credit cards are a common occurrence in any business environment, but they are especially common in B2C, high-transaction volume companies.

Whatever point-of-sale system you use, it should deliver a specific code number along with the decline receipt, but that won’t help give you the “why” without having the definitions of those codes.

Having these credit card decline codes on hand helps you provide better customer service by way of a more thoughtful and thorough explanation.

We’ve compiled a list of the most common denial reasons below, and if you can’t find the code here, we recommend contacting your POS provider directly.

List of common credit card declined codes

01 – Refer to issuer

The issuing bank (Visa, Mastercard, etc.) prevented the transaction.

Ask for a separate card to complete the transaction and/or ask the customer to call their credit card bank and figure out why the transaction was declined.

02 – Refer to issuer (special condition)

Just like Code 01, the issuing bank (Visa, Mastercard, etc.) prevented the transaction.

04 – Pick up card (no fraud)

The issuing bank (Visa, Mastercard, etc.) prevented the transaction.

05 – Do not honor

The issuing bank (Visa, Mastercard, etc.) prevented the transaction and is also telling you not to honor the card.

Ask for a separate card to complete the transaction and/or ask the customer to call their credit card bank and figure out why the transaction was declined.

07 – Pick up card, special condition (fraud account)

The issuing bank (Visa, Mastercard, etc.) prevented the transaction because it has flagged this account as fraudulent.

If it’s for a one-time transaction, do not run the card again, and don’t provide any more goods or services for the cardholder. If it was a recurring or scheduled transaction, follow up with your customer to make sure your business wasn’t incorrectly flagged as fraudulent. Ask that they follow up with their bank OR update their account with a newly provided card.

12 – Invalid transaction

The transaction you’re attempting is invalid — e.g. refunding a refund.

Make sure you’re transacting the right payment types and double-check that all payment batches are correctly configured.

13 – Invalid amount

The number field you attempted to transact was invalid. This usually is the result of a typo (negative amount or ineligible symbol).

Double-check what you entered and make sure it wasn’t negative or included incorrect symbols.

14 – Invalid card number

The card number is invalid, and your terminal is having trouble finding the relevant account.

Double-check the account number given and try again.

15 – No such issuer

The card number entered is wrong since it doesn’t start with a 3 (AMEX), 4 (Visa), 5 (MasterCard), or 6 (Discover).

Double-check the card number entered.

19 – Re-enter

An unknown error occurred.

Try it again, and if it continues, contact your merchant provider.

28 – File is temporarily unavailable

A temporary error occurred during the authorization process.

Try it again, and if the problem continues, contact your merchant provider.

41 – Lost card, pick up (fraud account)

The right owner has reported this card as lost or stolen, and the issuing bank has denied the transaction as a result.

Don’t try the transaction again and do not provide any additional goods or services to the cardholder. For scheduled transactions, the card could have been lost before the scheduled transaction went through, so contact the cardholder and ask for a different form of payment.

43 – Stolen card, pick up (fraud account)

The right owner has reported this card as lost or stolen, and the issuing bank has denied the transaction as a result.

Don’t try the transaction again and do not provide any additional goods or services to the cardholder. Make sure you report the transaction attempt to the relevant issuing bank. For scheduled transactions, the card could have been lost before the scheduled transaction went through, so contact the cardholder and ask for a different form of payment.

51 – Insufficient funds

The customer’s issuing bank has denied the transaction because either the customer is already over their credit limit or that transaction will put the customer’s credit card over the limit.

Either ask the customer to call their issuing bank and request a credit limit or request a different form of payment.

54 – Expired card

The expiration date entered is in the past.

Double-check you entered it correctly, ask the customer to confirm the expiration date with their issuing bank, or request an alternate payment method.

This code will appear if you are attempting a transaction and your customer’s card is not configured for that type of transaction.

Have your customer call their issuing bank (the number is typically printed on the back of the credit card) and ask that the transaction be permitted. When the bank confirms it will process correctly, attempt the transaction again.

This code will appear if you are attempting a transaction and your merchant processing account is not properly configured.

Contact your merchant provider and make sure your terminal/POS is set up to receive the type of payment you’re attempting.

This means one of two things: 1. You’re attempting to transact an AmEx card or a Discover transaction and your system doesn’t support them, or 2. A customer tried to pay online with a card that doesn’t support online payments.

For the first reason, call your merchant provider and make sure your terminal/POS supports American Express or Discover transactions. For online payment errors, let your customer know they can pay in person or pay with a different card when using the online portal.

63 – Security violation

The three-digit CVV2 or four-digit CID code on the back of the credit card wasn’t read correctly.

Attempt the transaction again without entering a CVV2/CID number. It should process normally. Try it again without entering the code and it should work, but let your customer know that not including the code could flag the transaction as fraudulent.

65 – Activity limit exceeded

Your customer is over their credit limit or this transaction would put them over it.

Have them use a different transaction method or have them call and request a credit limit adjustment.

85 or 00 – Issuer system unavailable

A temporary communication error occurred.

Try it again. If it doesn’t go through, contact your payment processor.

85 – No reason to decline

There’s no apparent problem, but something still went wrong. This error is sort of a catch-all.

Try it again. If the transaction still won’t go through, contact your payment processor.

91 – Issuer or switch is unavailable

The authorization communication failed for no specific reason.

Try it again. If the transaction still won’t go through, contact your payment processor or the relevant issuing bank.

93 – Violation, cannot complete

There’s a violation on the customer account, and the issuing bank has prevented the transaction.

Ask your customer to call their bank, and if the bank confirms everything is okay on their end, attempt the transaction again. Otherwise, just ask for a different card or payment method.

96 – System error

A temporary error occurred during the transaction.

Wait a minute or two and try again. Contact your payment processor if it still didn’t work.

RO or R1 – Customer requested stop of specific recurring payment

Your customer asked their bank to deny charges from your account.

Stop the recurring payments immediately. Then follow up with the customer to see if the request to stop payment was a mistake.

Источник

Invalid Transaction: Declined Code 12 Explained

Few things are more frustrating than having a customer who’s waiting to pay but can’t because of some error code, especially when there is a long line of customers behind them.

Or, if you’re running an eCommerce business, error codes could be dramatically lowering your checkout conversion rates — and you may not even know! Staying on top of error codes and diagnosing them quickly is key to running a successful business.

There are a variety of reasons why your POS may fire a decline code, from fraud to incorrect information, and it’s not realistic to memorize all of the codes and what they mean (although printing out a list of credit cards decline codes and hanging it nearby could be useful).

Today, we’re going to cover the invalid transaction, or declined code 12. Here’s everything you need to know about what it is and what to do about it.

What is declined 12 on a credit card?

Also known as the «invalid transaction» code, a credit card error code 12 is given when the issuing bank does not accept a transaction.

That’s super vague, but it’s true.

The issuing bank is the bank that gave the customer their card, and a declined 12 code is sort of a catch-all for error codes. It doesn’t mean one specific thing, but there are a few common reasons why your POS could be sending it.

Why did the POS give me an invalid transaction message?

Here are a few reasons why you could be getting a credit card code 12:

It could be one or a combination of these that is causing your system to fire an invalid transaction. Double-check that it’s not a user error and go from there.

What to do when you get a decline code 12

Decline code situations are always annoying, but follow these steps to resolve them as quickly as possible.

Step 1: Apologize to the customer.

Even if you’re pretty sure it’s their fault, being cordial goes a long way to making this process less frustrating for both parties.

Step 2: Try running the card again.

Take two! Most people try this first anyway, but just in case you haven’t!

Step 3: Double-check the information.

Take a slow read through the code, expiration date, name, and security code. Ask your customer to repeat it if necessary.

Step 4: Double-check the zip code.

It’s possible the customer moved recently and has accidentally put in the wrong zip code. Ask them politely if there’s another zip code possibility.

Step 5: Request a different card.

If you can’t get the card to work, see if your customer minds switching cards for you.

Step 6: Request an alternative form of payment.

See if they can pay by cash or check. If that isn’t an option, don’t just say sorry! Ask to take their name or give them a more direct phone line.

Chances are they’ll have to call their bank to figure things out, so you want to get them right back to the front of the checkout line when they’ve figured it out.

The last thing you want to do is lose a big sale to a competitor over a system error.

Get the rundown on credit card decline codes

Go here for a complete list of credit card decline codes. This is a great page to bookmark!

And if you are running an eCommerce business and want to customize the responses you give customers according to the error code they receive, Visa has some great automated response suggestions, which you can access here.

Save up to 35% on transaction fees with Tidal

Источник

Error codes and messages

Depending on your integration type, there are a number of error codes you can receive. All integrations can receive Generic error codes.

There are also error codes specific for an integration type or payment method:

Generic error codes

This error can have multiple potential causes. Here are some examples:
Cause:

Cause:

Cause: Missing parameter
Solution:

Cause:

Cause: The card number field contains an incorrect value.

Cause:

Cause: Missing user permission.
Solution: Add the Merchant Recurring role to the associated web service user.

Cause: The IBAN might be incorrect.

Cause: Missing txvariant details.
Solution: Check the requestData and pass the details correctly.

Cause: The IBAN might be incorrect.

Cause:

Solution:

Cause:

Cause: Incorrect date of birth format is being passed.
Solution: Check what is being passed in the dateOfBirth parameter.

Cause: The billingAddress object does not contain all the required fields.
Solution: Check the required parameters in the API Explorer.

Cause: The deliveryAddress is ‘null’ or there is an error in the delivery address format.

Cause: The shopperName is ‘null’.

Cause:

Cause: shopperReference is ‘null’.

Cause: The phoneNumber or telephoneNumber is ‘null’.

Cause: The recurring object is not passed correctly.
Solution: Check the requestData and make sure that the recurring object is correct.

Cause:

Solution: Check variable/input passed into field.

Cause:

Solution: Check if the reference parameter is passed correctly.

Cause:

Solution: Check variable/input.

Cause:

Cause:

Solution: Pass all required parameters or make sure that you pass data in each parameter.

Cause: StateOrProvince field is missing in delivery address and is required for the selected country.

Cause:

Solution:

Cause: Not passing numeric or valid values.
Solution: Check what variable or input is being passed into the CVC field.

Cause:

Solution:

Cause:

Cause: Merchant server-side date/time is not set up correctly. For example, the merchant server side is set up to 1975 when it is 2020, or the date isn’t in a plus or minus 24 hour range as of today.
Solution: Check the server-side date/time configuration.

Cause:

Solution: If you are seeing this using a plugin, generate a new web service user with the relevant permissions.

Cause: Check if the parameters sent are formatted correctly in JSON.
Solution: Read through the requestData to find the error.

Cause: shopperReference is empty, doesn’t exist or is not found.

Cause: shopperEmail is empty, doesn’t exist or is not found.

Cause: The selected brand is not equal to the brand on the stored token, or empty.

Cause: Not found in Recharge. Qiwi can also throw this error if recurring contract isn’t found.

Cause: Value is empty or ‘null’, or the name doesn’t match with the recurringDetail name.

Cause:

Solution:

Cause:

Cause: The previous recurringDetail token was not saved correctly or does not exist.

Cause: The shopperIP is empty.

Cause:

Cause:

Cause: The reference contains more than 80 characters.

Cause:

Cause:

Источник

Коды ошибок Visa/MasterCard/МИР

В данной статье собраны коды ошибок действующих банков-эквайеров.

Часто встречающиеся ошибки:

Код 05 – отказ эмитента без указания причины

Код 17 – отказать, отклонено пользователем карты

Код 41 – утерянная карта

Код 43 – украденная карта

Код 51 – недостаточно средств для проведения операции

Код 57 – недопустимый тип операции для данного типа карты (например, попытка оплаты в магазине по карте предназначенной только для снятия наличных)

Код 61 – превышение максимальной суммы операции или количества попыток для данной карты; превышен лимит на терминале продавца; недостаточно средств на счете продавца, в случае выплат (более точное описание смотрите ниже, исходя из обслуживающего банка)

Код 62 – заблокированная карта

Код 65 – превышение максимального количества операции для данной карты

Код 83 – ошибка сети (технические проблемы)

Код 91 – эмитент недоступен (технические проблемы на стороне банка-эмитента)

Код 96 – системная ошибка/невозможно связаться с банком, который выдал карту (требуется сверка с эквайером)

Полный список кодов ПАО « Промсвязьбанк » :

Полный список кодов ПАО Банк «ФК Открытие»:

Полный список кодов АО «Банк Русский Стандарт»:

Коды отказов платежных систем Visa, MasterCard, МИР (общее описание)

Источник

Developer Hub

Extended Payment API

Orders

Shopping Context

Shoppers

Catalog

Subscriptions

Wallets

Errors

Resources

Test Data & Codes

Guides & Tools

Payment & Processor Errors

The following errors can be returned in response to requests related to payment processing, including Order, Shopping Context, and Subscription requests.

Exceeded maximum fraction digits for currency [USD]. Maximum is [2].

Payment processing failure because the authorization has already been reversed.

Payment processing failure due to invalid amount for this transaction.

Payment processing failure because the authorization has expired.

Authorization must be performed before capture.

Payment processing failure because the authorization was not found.

Your payment request could not be successfully completed.

Your payment request could not be successfully completed.

Your payment request could not be successfully completed.

Your payment request could not be successfully completed.

Payment processing failure due to an unspecified error. Please contact the issuing bank.

The card is lost or stolen.
Your payment request could not be successfully completed.
Retry the transaction using a different card or decline the transaction.

Shopping cart or shopping cart parameters are required.

The cart contains CDoD but no item in the cart supports CDoD.

Changing SKU for subscription is not supported.

Credit card details decryption failed due to invalid input.

Credit card details decryption failed due to invalid public key.

Credit card details decryption failed.

Coupon code is required.

Coupon was not found.

Only one coupon can be used for each order.

Shopper credit card cannot contain both plain and encrypted details.
Correct the shopper details and resubmit.

Credit card encrypted number is required.
Add the encrypted card number and resubmit.

Credit card encrypted security code is required. Add the encrypted security code and resubmit.

The Currency Code passed in the request was not found.

Custom parameter was not found.

Payment processing failure due to CVV error.
Correct the CVV code and retry the transaction.

Payment processing failure due to issuing bank decline. Try another payment method or wait 24 hours before trying again.

The cart contains EDW but no item in the cart supports EDW.

The shopping cart is empty.

The parameters specified to the service lead to an empty result.

Expected total price does not match the calculated total price.
or
Transaction could not be completed due to unsupported currency

Your payment request could not be successfully completed.
Correct the expiration date and retry. If the transaction still fails, retry with a different payment method or decline the transaction.

Internal processing error, please contact support.

A general payment failure has occurred.
Your payment request could not be successfully completed.

Payment processing failure due to high risk.

Subscription Charge creation failure since the subscription is in a non-active state.

Payment processing failure due to incorrect information.

Description will contain additional information about the specific error.

Payment processing failure due to incorrect setup.

Your payment request could not be successfully completed.
Retry the transaction at a later date, use a new payment method or decline the transaction.

There are not enough funds in your account to issue this refund, please contact [email protected]

Invalid affiliate ID.

Payment processing failure due to invalid amount for this transaction.

The bank country passed in the request is invalid.

The cancellation reason passed in the request is invalid.

Payment processing failure due to invalid card number.
Correct the card number and retry the transaction. If the transaction still fails, try a new payment method or decline the transaction.

Payment processing failure due to invalid card type.
Correct the card number and retry the transaction. If the transaction still fails, try a new payment method or decline the transaction.

Updating subscription failed due to invalid currency code.

The custom parameter passed in the request is invalid.

One or more parameters specified to the service are invalid.

The IP address passed in the request is invalid.

The number of shopper payment methods is invalid.

Page name is invalid or missing.

Payment processing failure due to invalid PIN or password or ID error.

The Shopper ID passed in the request is invalid.

Invalid SKU parameter.

Invalid step field.

Payment processing failure because this transaction is not allowed by the issuer.

Transaction type is invalid.
Note: HTTP status is 403 Forbidden.

The VAT ID passed in the request is invalid.

Invoice has already been refunded.

Invoice has already been fully refunded.

The invoice ID passed in the request was not found.

License key regeneration errors.

Payment processing failure because card limit has exceeded.
Retry the transaction later, use a new payment method, or decline the transaction.

Missing parameter key or value.

Shopper has multiple payment methods, but none is selected.
Correct the payment method and resubmit.

The total amount is negative.

Next charge amount is required.

Next charge currency is required

The next charge amount passed in the request is negative.

There are no available processors for the specific request.

Shopper not found for subscription ID

Partial refund failed because the given amount must be greater than zero.

The quantity passed in the request is 0 or negative.

Order invoice or subscription ID is required.

The order ID passed in the request was not found.

The partial refund amount is required.

Simultaneous usage of invoice refund amount and SKU refund amount parameters is not allowed.

SKU does not relate to specified invoice.

SKU amount is invalid.

Partial refund failed because only financial transactions which contain exactly one sku can be partially refunded.

Invoice cannot be partially refunded.

SKU amount is required for partial refunds.

SKU amount exceeds maximum amount allowed for that SKU.

Payment info is required.

Contact Merchant Support to issue this refund.

Payment processing failure because the attempted operation is not supported for this payment method.

Custom plan subscriptions are not supported in PayPal. Please choose an alternative payment method.

Updating PayPal subscription failed due to data mismatch.

Multiple subscriptions are not supported in PayPal. Please choose an alternative payment method.

Persisted shopping context is not found.

Payment processing failure. The card has been reported lost or stolen and should be removed from use.

Plan change with more than one SKU.

Payment processing failure due to invalid amount for this transaction.
Validate the amount submitted is correct and resubmit. If the transaction still fails decline the transaction.

Payment processing failure due to duplication. The transaction is a duplicate of a previously submitted transaction.

Payment processing failure due to an unspecified error returned. Retry the transaction and if problem continues contact the issuing bank, or decline the transaction.

Payment processing failure due to timeout.
Retry the transaction.

A general payment failure has occurred for this refund.

A failure has occurred. Please contact BlueSnap support for further assistance.
Retry the transaction.

Transaction is not valid for refund as transaction has not been cleared yet. Please wait 3-7 days and try again.

Another refund request for this invoice is currently in process. Please wait for it to finish before submitting new request.

Refund amount cannot be more than the refundable order amount.
Correct amount and resubmit.

Refund amount must be greater than 0.
Correct the amount and resubmit.

The refund couldn’t be issued since the original order has a zero total amount

The time limit to perform a refund on this transaction has expired.

The refund couldn’t be issued since the original order doesn’t contain any refundable items.

Payment processing failure due to restricted card.

Источник

Payment Error Codes

For American Express call: (800) 528-2121
For Diners Club call: (800) 525-9040
For Discover/Novus call: (800) 347-1111
For JCB call : (800) 522-9345
For Visa/Mastercard call: (800) 228-1122

Once an authorization is issued, you can then submit the transaction through your Virtual Terminal as a Capture Only transaction.4This transaction has been declined.The code returned from the processor indicating that the card used needs to be picked up.5A valid amount is required.The value submitted in the amount field did not pass validation for a number.6The credit card number is invalid.7Credit card expiration date is invalid.The format of the date submitted was incorrect.8The credit card has expired.9The ABA code is invalidThe value submitted in the routingNumber field did not pass validation or was not for a valid financial institution.10The account number is invalidThe value submitted in the accountNumber field did not pass validation.11A duplicate transaction has been submitted.The error message “Duplicate Transaction” indicates that a transaction request with the same information has been submitted within two minutes of a previous attempt. Authorize.Net looks for transactions which are likely to be duplicates by matching the data provided with the transaction.

The fields that are validated include:

If any of the fields change from one transaction to the next, Authorize.Net will not view the transactions as duplicates.
The duplicate transaction window will always be two minutes for all transactions submitted through the Virtual Terminal. If you wish to adjust the duplicate transaction window for transactions submitted from your software, such as a website or shopping cart, you may do so by adding the field duplicateWindow to your website script.
If you are unable to adjust or add this variable to your shopping cart settings, please contact your shopping cart support team for additional assistance in this regard. The variable duplicateWindow tells us, in seconds, how much time we should check for duplicates after a transaction is submitted.
The largest value we will accept for duplicateWindow is 28800, which equals eight hours. If a value greater than 28800 sent, the payment gateway will default to 28800. If duplicateWindow is set to 0 or to a negative number, no duplicate transaction window will be enforced for your software’s transactions. If no value is sent, the default value of 120 (two minutes) would be used.
For example, if you wished to set a duplicate transaction window of five minutes (= 300 seconds) you would set duplicateWindow to 300.
Note: By submitting duplicateWindow with your online transactions, we will return further details along with this error response, including:

If you do not submit the duplicateWindow field, we will not return any details from the original transaction, even if you submit a duplicate transaction.A transaction with identical amount and credit card information was submitted within the previous two minutes.12An authorization code is required but not present.The transaction request required the field authCode but either it was not submitted, or it was submitted without a value.13The merchant login ID or password is invalid or the account is inactive.This error indicates you are either posting the incorrect API Login ID within your script, connecting to a server that does not recognize your account, or using an account which is inactive. Please follow these steps to ensure that your software is connecting correctly:

To change the field value to not required:

If the Merchant Profile has your correct address-including the country-then you may need to contact your Merchant Service Provider to confirm that TSYS/Vital/Visanet has the correct address for validation.64The referenced transaction was not approved.This error is applicable to Wells Fargo SecureSource merchants only. Credits or refunds cannot be issued against transactions that were not authorized.65This transaction has been declined.The transaction was declined because the merchant configured their account through the Merchant Interface to reject transactions with certain values for a Card Code mismatch.66This transaction cannot be accepted for processing.Transaction was submitted using HTTP GET which does not meet payment gateway security guidelines.If you are using the SIM connection method, make sure your code is providing values for the SIM required fields listed below:

Any fingerprint hash can only be used once in 24 hours.

If a customer fills in incorrect information and the transaction is declined, they cannot click Back and re-enter the information as this will attempt to use the same fingerprint hash in resubmitting the transaction request, which will result in error 98.

The customer must be directed back to the page that sets the amount of the transaction request, then re-enter information from that point on.Applicable only to the SIM API. The transaction fingerprint has already been used.99This transaction cannot be accepted.Please use the Response Code 99 Tool.Applicable only to the SIM API. The server-generated fingerprint does not match the merchant-specified fingerprint in the x_fp_hash field.100The eCheck type parameter is invalid.Applicable only to eCheck.Net. The value specified in the echeckType field is invalid.101The given name on the account and/or the account type does not match the actual account.Applicable only to eCheck.Net. The specified name on the account and/or the account type do not match the NOC record for this account.102This request cannot be accepted.NOTE: This response is valid only for an integration method that has been sunset and is no longer available. If you encounter this error, please contact Merchant Support for assistance.

If you are receiving this error, it indicates that either x_password or x_tran_key is being submitted with your WebLink request. This represents a security risk as the password or transaction key could be viewed in your source code.

We highly recommend that you upgrade your connection method.

Please visit our Developer Center for up-to-date documentation.A transaction key was submitted with this WebLink request.103This transaction cannot be accepted.This error is generated when your account is in «Password-Required Mode» and you are not sending a valid password, transaction key or hash fingerprint with your transaction request, which is a recommended security measure.
Please consider the following details when encountering this error:

Also, verify that the merchant’s processor supports Verified by Visa and Mastercard SecureCode authentication values through Authorize.Net.

Note that the TSYS payment processing platform was formerly known as Vital or Visanet. On TSYS/Vital/Visanet, Error 180 is an valid response indicating that a transaction was submitted and correctly received, but rejected due to using a test card number. If the processor is incorrectly configured, the response will be something more generic like a response of 30, 34, or 35.The processor response format is invalid.181An error occurred during processing. Please try again.The system-generated void for the original invalid transaction failed. (The original transaction included an invalid processor response format.)»182One or more of the sub-merchant values are invalid.183One or more of the required sub-merchant values are missing.184Invalid Token Requestor Name.185This transaction cannot be processed.Merchant is not configured for VPOS.186Invalid Token Requestor ID Length.187Invalid Token Requestor ECI Length.191This transaction has been declined.192An error occurred during processing. Please try again.193The transaction is currently under review.195One or more of the HTML type configuration fields do not appear to be safe.200This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The credit card number is invalid.201This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The expiration date is invalid.202This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The transaction type is invalid.203This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The value submitted in the amount field is invalid.204This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The department code is invalid.205This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The value submitted in the merchant number field is invalid.206This transaction has been declined.This error code applies only to merchants on FDC Omaha. The merchant is not on file.207This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The merchant account is closed.208This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The merchant is not on file.209This transaction has been declinedThis error code applies only to merchants on FDC Omaha. Communication with the processor could not be established.210This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The merchant type is incorrect.211This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The cardholder is not on file.212This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The bank configuration is not on file.213This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The merchant assessment code is incorrect.214This transaction has been declinedThis error code applies only to merchants on FDC Omaha. This function is currently unavailable.215This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The encrypted PIN field format is invalid.216This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The ATM term ID is invalid.217This transaction has been declinedThis error code applies only to merchants on FDC Omaha. This transaction experienced a general message format problem.218This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The PIN block format or PIN availability value is invalid.219This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The ETC void is unmatched.220This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The primary CPU is not available.221This transaction has been declinedThis error code applies only to merchants on FDC Omaha. The SE number is invalid.222This transaction has been declinedThis error code applies only to merchants on FDC Omaha. Duplicate auth request (from INAS).223This transaction has been declinedThis error code applies only to merchants on FDC Omaha. This transaction experienced an unspecified error.224This transaction has been declinedThis error code applies only to merchants on FDC Omaha. Please re-enter the transaction.225This transaction cannot be processed.The transaction has an invalid dynamic currency conversion (DCC) action.226This transaction cannot be processed.Incomplete set of Dynamic Currency Conversion (DCC) parameters.227This transaction cannot be processed.Merchant is not configured for Dynamic Currency Conversion (DCC).228This transaction cannot be processed.Dynamic Currency Conversion (DCC) is not allowed for this transaction type.229Conversion rate for this card is available.230This transaction cannot be processed.Transaction could not be found.231This transaction cannot be processed.Incoming data is different than the referenced Dynamic Currency Conversion (DCC) transaction.232This transaction cannot be processed.Merchant is not configured for Dynamic Currency Conversion (DCC).233This transaction cannot be processed.Cannot perform Dynamic Currency Conversion (DCC) action on this transaction.234This transaction cannot be processed.This transaction has been voided.235This transaction cannot be processed.This transaction has been captured previously.236This transaction cannot be processed.Dynamic Currency Conversion (DCC) data for the referenced transaction is not available.237This transaction cannot be processed.The referenced transaction has expired.238This transaction cannot be processed.The transaction version does not support Dynamic Currency Conversion (DCC).239This transaction cannot be processed.The response format for this transaction does not support Dynamic Currency Conversion (DCC).240This transaction cannot be processed.Currency for Dynamic Currency Conversion (DCC) transactions must be US dollars.241This transaction cannot be processed.Invalid response from card processor.242This transaction cannot be processed.Recurring billing flag not allowed on Dynamic Currency Conversion (DCC).243Recurring billing is not allowed for this eCheck.Net type.The combination of values submitted for recurringBilling and echeckType is not allowed.244This eCheck.Net type is not allowed for this Bank Account Type.The combination of values submitted for accountType and echeckType is not allowed.245This eCheck.Net type is not allowed when using the payment gateway hosted payment form.The value submitted for echeckType is not allowed when using the payment gateway hosted payment form.246This eCheck.Net type is not allowed.This error also occurs if you submit a check number for your WEB, TEL, CCD, or PPD eCheck.Net transaction. Check numbers are only valid for ARC and BOC eCheck.Net transactions. See the eCheck.Net User Guide for details on eCheck.Net transaction types and requirements.The merchant’s payment gateway account is not enabled to submit the eCheck.Net type.247This eCheck.Net type is not allowed.The combination of values submitted for transactionType and echeckType is not allowed.248The check number is invalid.Invalid check number. Check numbers can only consist of letters and numbers, up to 15 characters.250This transaction has been declined.This transaction was submitted from a blocked IP address.251This transaction has been declined.This transaction was submitted from a blocked IP address.The transaction was declined as a result of triggering a Fraud Detection Suite filter.252Your order has been received. Thank you for your business!The transaction was accepted, but is being held for merchant review. The merchant may customize the customer response in the Merchant Interface.253Your order has been received. Thank you for your business!The transaction was accepted and was authorized, but is being held for merchant review. The merchant may customize the customer response in the Merchant Interface.254This transaction has been declined.The transaction was declined after manual review.260Reversal not supported for this transaction type.Only authorizations and credits can be reversed.261An error occurred during processing. Please try again.The transaction experienced an error during sensitive data encryption and was not processed. Please try again.262The PayformMask is invalid.265This transaction cannot be processed.The transaction was submitted with an invalid Solution ID. For details on how to register and submit a Solution ID, please see The Solution ID Implementation Guide.270Line item %1 is invalid.A value submitted in lineItem for the item referenced is invalid.271The number of line items submitted is not allowed. A maximum of %1 line items can be submitted.The number of line items submitted in lineItem exceeds the allowed maximum of 30.280The auction platform name is invalid.281The auction platform ID is invalid.282The auction listing type is invalid.283The auction listing ID is invalid.284The auction seller ID is invalid.285The auction buyer ID is invalid.286One or more required auction values were not submitted.287The combination of auction platform ID and auction platform name is invalid.288This transaction cannot be accepted.289This processor does not accept zero dollar authorization for this card type.290There is one or more missing or invalid required fields.295The amount of this request was only partially approved on the given prepaid card. An additional payment is required to fulfill the balance of this transaction.296The specified SplitTenderID is invalid.297Transaction ID and Split Tender ID cannot both be used in the same request.298This order has already been released or voided therefore new transaction associations cannot be accepted.300The device ID is invalid.Invalid deviceId value.301The device batch ID is invalid.Invalid batchId value.302The reversal flag is invalid.Invalid x_reversal value.303The device batch is full. Please close the batch.The current device batch must be closed manually from the POS device.304The original transaction is in a closed batch.The original transaction has been settled and cannot be reversed.305The merchant is configured for auto-close.This merchant is configured for auto-close and cannot manually close batches.306The batch is already closed.307The reversal was processed successfully.308Original transaction for reversal not found.The transaction submitted for reversal was not found.309The device has been disabled.310This transaction has already been voided.311This transaction has already been captured.312The specified security code was invalid.The SIM hosted payment form features a Security Code option (sometimes called CAPTCHA) used to confirm that the payment is being entered by a human being. This feature helps protect your site from automated scripts that may try to test credit card numbers through the payment form.

The Security Code works by generating an image that contains random numbers and letters that cannot be read by scripts. The customer is then prompted to enter the letters and numbers exactly as they appear in the image. If the customer enters the correct Security Code, the transaction is accepted as valid.

Error 312 indicates that the customer had entered the wrong Security Code. Should this error occur, a new Security Code is generated, and the customer is prompted to try again until they are successful.

To turn off the Security Code option:

Note: When using Simple Checkout, the customer is always required to verify a Security Code. Even if the Security Code is disabled from the payment form, the customer is required to verify a Security Code on the Simple Checkout order page.313A new security code was requested.The SIM hosted payment form features a Security Code option (sometimes called CAPTCHA) used to confirm that the payment is being entered by a human being. This feature helps protect your site from automated scripts that may try to test credit card numbers through the payment form.

The Security Code works by generating an image that contains random numbers and letters that cannot be read by scripts. The customer is then prompted to enter the letters and numbers exactly as they appear in the image. If the customer enters the correct Security Code, the transaction is accepted as valid.

If they enter an incorrect value, the customer is prompted to try again until they are successful.

To turn off the Security Code option:

Note: When using Simple Checkout, the customer is always required to verify a Security Code. Even if the Security Code is disabled from the payment form, the customer is required to verify a Security Code on the Simple Checkout order page.314This transaction cannot be processed.315The credit card number is invalid.This is a processor-issued decline.316Credit card expiration date is invalid.This is a processor-issued decline.317The credit card has expired.This is a processor-issued decline.318A duplicate transaction has been submitted.This is a processor-issued decline.319The transaction cannot be found.This is a processor-issued decline.320The device identifier is either not registered or not enabled.325The request data did not pass the required fields check for this application.The request is missing one or more required fields.Merchants processing transactions via one of the following processors (AIBMS UK, Barclays, Cardnet, HBOS, HSBC, Streamline, FdiAus and Westpac) are required to submit the following billing information fields:

Источник

Invalid Credit Card Number validation false positive, help please!

For some reason the credit card number validation is throwing a false-positive. I’ve tested two different cards and they both return «Invalid credit card number.» error. The fields all end up empty and I have to re-enter. Here’s where the form is: https://wmcfest.com/sponsor-us/

It isn’t leaving the server as far as I can tell because there’s no sign of it in the Stripe logs. There are no php errors logged either. So it seems like a js/ajax validation error. Not sure where next to look for troubleshooting. We have the latest Gravity version, although Stripe plugin may be outdated if there’s not an alert in WP.

Thanks for any insight.

Update, I’ve tested it with and without Steps splitting up the form and still get the «Invalid credit card number» regardless of real or test CCs. I don’t see an ajax/xhr call so it seem to be using a basic post to php but there aren’t errors in the php. I’ve tested it with the preview (non theme) view as well and it still throws the invalid CC error. I’ve also tested it with and without HTML5 enabled and noconflict mode but it always throws the false positive. Is this supposed to be using an ajax form? Maybe the js didn’t update when the plugin did? I don’t think it is Stripe plugin related because it doesn’t seem to leave the form prevalidation but for good measure I’ll switch to a different gateway plugin and see if that makes a difference.

David Peralty

Stripe is a third party add-on and as such, you’ll have to contact the author for support. http://wordpress.org/extend/plugins/gravity-forms-stripe/

Okay, I stand corrected. It DOES seems to be the Stripe plugin that is the culprit! I switched to Authorize and it works now. Let me know if there’s anything we can do to help you improve the Stripe plugin. Thanks.

Ah, I didn’t realize that wasn’t even your plugin David, thank you. We’ll let them know.

David Peralty

No problem. All my best!

Источник

medipass/react-credit-card-input

Use Git or checkout with SVN using the web URL.

Work fast with our official CLI. Learn more.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching GitHub Desktop

If nothing happens, download GitHub Desktop and try again.

Launching Xcode

If nothing happens, download Xcode and try again.

Launching Visual Studio Code

Your codespace will open once ready.

There was a problem preparing your codespace, please try again.

Latest commit

Git stats

Files

Failed to load latest commit information.

readme.md

React Credit Card Input

A credit/debit card input field for React

NOTE: While React Credit Card Input is still supported, it’s highly recommended to check out the React Payment Inputs (the rewritten version of this library).

Input renderer props

Custom input renderer usage

Custom text labels usage

Contributing to react-credit-card-input is easy! With four simple steps:

Источник

Keep getting «Card number is invalid» about react-credit-card-input HOT 3 OPEN

Am I missing something?

Comments (3)

That is because 4343 4343 4343 4343 is invalid.

TommyLeong commented on January 7, 2021

@olitomas Good info about the link you shared (Luhn Algorithm Check), but I’ve tried with my actual VISA credit card as well and it didn’t get passed either. Why was that?

olitomas commented on January 7, 2021

Thats kind of hard to know without knowing your credit card number. and sending a stranger on the internet your credit card number is a recipe for a bad time! So you are going to have to figure that one out for your self 😉

Related Issues (20)

Recommend Projects

A declarative, efficient, and flexible JavaScript library for building user interfaces.

Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

TensorFlow

An Open Source Machine Learning Framework for Everyone

Django

The Web framework for perfectionists with deadlines.

A PHP framework for web artisans

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

Some thing interesting about web. New door for the world.

server

A server is a program made to process requests and deliver data to clients.

Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

Visualization

Some thing interesting about visualization, use data art

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.

Microsoft

Open source projects and samples from Microsoft.

Источник

medipass / react-credit-card-input Goto Github PK

💳 A credit/debit card input field for React

License: MIT License

JavaScript 99.23% CSS 0.77%

react-credit-card-input’s Introduction

React Credit Card Input

A credit/debit card input field for React

NOTE: While React Credit Card Input is still supported, it’s highly recommended to check out the React Payment Inputs (the rewritten version of this library).

Input renderer props

Custom input renderer usage

Custom text labels usage

Contributing to react-credit-card-input is easy! With four simple steps:

react-credit-card-input’s People

Contributors

Stargazers

Watchers

Forkers

react-credit-card-input’s Issues

Error message is not retained

It is possible to enter an invalid cc number, leave the field and get no error message.

-When I enter an invalid CC number, an error message appears (Expected).
-When I jump to the exp date and the cvc, the number validation error disappears (Expected I guess, since I’m technically on a different input).
-When I leave the entire credit card field (blur event), the cc number is still invalid, but shows no error message and no onError event occurs (not expected). I would expect the field to tell the user there is an error with their input, or that the onError event triggers since the entry was invalid.

Steps to reproduce.

Use with preact

Would be great if I could use this awesome component with preact.

I get the error
Warning: setState(. ): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op.

no event onKeyDown props

i can’t catch event onKeyDown in props,

Access to error handler

Thanks so much for this awesome library. Really appreciate all the hard work that’s gone into it.

Im wondering if there is a way to have access to the valid / invalid state via an onChange callback of some kind. Looking to see if the entered card is valid, and if it is, allow the user to move on to the next part of the form.

Issues with Input Style

How do you add style to one of the field? Like if I do not want CVV to show

OnBlur event improvement

Hi, your credit card solution for react very nice!

For example, if I’d like to disable submit button, if at least one input are invalid.

And if invalid card, no error after filling CVC and OnBlur

Awesome but would love typescript types ;)_

Can’t type for expiry date

I’m unable to input anything for the expiry date. The error I’m getting in the console is this:

TypeError: Cannot read property ‘invalidExpiryDate’ of undefined

To fix this issue, I had to add a customTextLabel object with expiryError.

But customTextLabel is optional. So this seems like a bug to look into.

payment module is overriding global Payments

The npm module payment is overriding/setting a global Payments variable. This is causing problems, we have a global Payments variable. Is it possible to turn this global ovveriding off? Or move away from payment module to another drop-in replacement?

Support for mobile style

The credit card form is not correctly visualized in mobile screen.

How to reset state?

So that there’s no errors and specific card images.

What branch is the demo code on?

Awesome package! Thanks for all your hard work!

I noticed that there is a slight difference in the code that is pulled from master versus the demo at https://medipass.github.io/react-credit-card-input. Where is that code located?

Can you please provide the code that is being used on the demo?

Callback for Error to Valid State

Field layouts

Is the layout restricted to the exact order of the fields? I would like to put each of the input fields in a separate div and place the credit card icons in a different position. Is this possible with the current implementation? If not, what is the best way to go about using the code you wrote and changing it to suit my needs?

Card image animations

Would be super dope if the card image could have a little animation when the card type has changed!

Bug with few invalid values

Result

form is valid but card number and expiry date is not valid

Expected result

form should not be valid and error message that card number is not valid.

Possible solution

Check if all fields valid, not only current.

Not working with Diners Club cards

How this work with Diners Club cards. I tried with stripe test card its not working.
Card number : 3056930009020004

Upgrade styled-components

Styled components is at 3.3.3, but this still uses 2.x. If your app uses 3.x, and includes this, there are some crazy results.

Maybe a peer dep would be better?

Chrome dev console warning: Invalid DOM property `maxlength`

Displaying a default CreditCardInput in a react app generates the following warning in the developer console:

When you want to edit credit card number cursor should remain at the same position

expected result :
you should keep cursor position

Tested :
Was tested on demo page from here

Possibility to input invalid credit card number

If I start to input the invalid credit card number, component fails to

Uncaught TypeError: Object(. ) is not a function

Card: validation failed

When input expiry date with any pervious month of the current year, it doesn’t show any error.

Use Rollup instead of Webpack

is there a way to check debit card number

cardNumberInputRenderer is not a function

By using provided examples there is an exeption thrown

Propper fix for this is to add following properties:

Seems like such function supposed to be default value but it is not set in the latest version of the lib

Postal Code?

Is only USA supported? How about the countries that have postal codes and not a zip code?

Pattern Regex fails

Keep getting «Card number is invalid»

Am I missing something?

Customize labels

Is there a way to the change text, e.g. Card number, Card number is invalid, etc?

More meaningful error messages

The error messages are pretty generic at the moment. If an input is invalid, it will just display that the input is invalid (e.g. ‘Card number is invalid’). Would be nice to have more meaningful error messages such as ‘Card number is too short’.

Here are the cases I can think of off the top of my head:

Example with Stripe?

Has anyone managed to use this with Stripe? If so, can you share a proof of concept implementation?

I’m unable to use amex card with this library upon entering amex card no. I get validation error given in attached image:

Is there a way to access the card type value?

I need a way to get the card type value. Is there a way to that atm?

Thanks for the hard work!

Flowify

Chucking Flow into the project would be sweet!

Invalid expiry date UX

The invalid expiry date UX is a bit shit atm. When you type an invalid month (e.g. 43 ), then you can set a 4-digit year, when it’s only meant to be a 2-digit year.

It is expected that when you enter an invalid month, you can still only enter a 2-digit year.

Tests are failing with Jest using CRA

Test suite failed to run
Cannot find module ‘react’ from ‘index.js’

Auto-completion support

Style overrides

Currently, we are unable to override the default styling of the component. It would be great to do so!

I was thinking style (styled-components) overrides for the following:

and class overrides for the following:

Recommend Projects

A declarative, efficient, and flexible JavaScript library for building user interfaces.

Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

TensorFlow

An Open Source Machine Learning Framework for Everyone

Django

The Web framework for perfectionists with deadlines.

A PHP framework for web artisans

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

Some thing interesting about web. New door for the world.

server

A server is a program made to process requests and deliver data to clients.

Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

Visualization

Some thing interesting about visualization, use data art

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.

Microsoft

Open source projects and samples from Microsoft.

Источник

Все об обработке платежей

Коды ответов статусов транзакций

В большинстве случаев транзакции авторизуются успешно, но может случиться так, что транзакция не будет авторизована, и карта клиента будет отклонена банком-эмитентом или обработчиком платежей. В этом случае вы получите конкретный код ошибки для транзакции с конкретным клиентом. Иногда этот код кажется неоднозначным и требует большего объяснения.

Банковский счет клиента не существует, или представленный номер карты не связан ни с одним банковским счетом.

Источник

Validating Credit Card in JavaScript, using loop to cycle through form field names, getting error

Working on a problem for a class. Need to do credit card validation per these instructions:

You’re starting your own credit card business. You’ve come up with a new way to validate credit cards with a simple function called validateCreditCard that returns true or false.

Here are the rules for a valid number:

Number must be 16 digits, all of them must be numbers You must have at least two different digits represented (all of the digits cannot be the same) The final digit must be even The sum of all the digits must be greater than 16

The following credit card numbers are valid:

The following credit card numbers are invalid:

You will need to create a web form that allows your users to enter credit card numbers and on change, validate if the credit card is valid and display a message to the user accordingly.

Hint: Remove the dashes from the input string before checking if the input credit card number is valid. (check out split() and join() methods.

5 points extra: Return an object indicating whether the credit card is valid, and if not, what the error is < valid: true, number: 'a923-3211-9c01-1112' >

And display it appropriately.

5 points extra: Make your credit card scheme even more advanced! What are the rules, and what are some numbers that pass or fail? Ideas: check expiration date! Check out the Luhn Algorithm (Links to an external site.)Links to an external site. for inspiration.

Here’s my javascript (the code is undated):

I am trying to create a loop with i so that instead of doing a long list of variables to use to reference the different form fields: creditCard1. 2. 3 etc.

Источник

Credit card form web component tutorial

November 29, 2021 10 min read 2907

As developers, we so often need to build forms that take credit card information, constantly repeating that code on each website, modifying it to fit into a PHP site here, a React site there, and into the strange custom-built content management system that can’t go down for a second.

Well, there’s a way to wrap all the separate credit card separate fields into one single field, add its own error correction, and use it seamlessly across every site in your portfolio, no modifications needed. We can build it using web components.

Web components are essentially custom HTML elements that work across all the different platforms you must support. In this article, we’ll learn how to work with web components to build a credit card form.

Note that we’re only looking at frontend concerns, so be sure to have encryption and other security measures in place to properly care for the data a user entrusts you.

Creating a credit card form

First, let’s put together what a credit card form looks like before we make it a web component.

We’ll need four main fields to start with: the name on the card, the card number, the expiration date, and the CVV code. We could expand on this by adding a billing address and other relevant information, but we’ll stick to these four fields for the purposes of this article:

Creating a web component for the credit card fields

Alright, let’s now use a web component to place our four credit card fields into a single custom HTML element.

We’ll call the element (autonomous web component names, that is, the ones we name ourselves, must have a hyphen in them).

Over 200k developers use LogRocket to create better digital experiences

There are three major parts to any web component: HTML, CSS, and JavaScript. The HTML is the element name that we just decided and, if we have any standard HTML we want to include (which we do), we must add that within a element.

We can also add elements for any content we might want to change whenever we create a new instance of the web component. However, for our particular purposes, we don’t need any slots since users will put in their own information and we won’t need to differentiate anything between instances.

Thus, the template includes the four fields from above with a wrapper div to ensure the layout remains consistent across instances. Then the template element wraps around all of that:

Creating a custom JavaScript element

The next step is to set up our new custom element in JavaScript. We’ll extend the HTMLElement class and give our new element all the properties of a built-in element. We can then add on and expand our custom element’s capabilities.

Let’s first grab the template we set up and insert it into the element called the shadow DOM, which is an internal DOM to the element. We’ll do this in the constructor (the function that runs when we’re creating the element and sets everything up):

More great articles from LogRocket:

Because shadowDom is tangentially associated with the full DOM, it acts as a black box that won’t let CSS styles invade its premises. But, that also means it will not let those styles out.

In this way, your CSS can be encapsulated within the element and kept with your web component on any site or context you put it in.

How do we set these styles, though? We use a style element in our template. Just put your CSS in a style element in your template, which affects the content of the web component, but nothing else:

Now that we have the web component in place, all we must do to use it is place the following in our code and our form fields appear:

Form-associated web components

By using web components to make our fields into an element, they’re still not hooked into the form in any way. If we submit the form as is, it won’t submit any content for our subfields. To hook into the form’s built-in processes, we must make it a form-associated web component.

Everything we’ve done up to this point is supported in all browsers, but, unfortunately, form-associated web components aren’t available in Safari yet, and have limited availability in Firefox. Luckily they are fully supported in Edge and Chrome. (There’s also a polyfill available if you need it.)

To make a web component form-associated, set a formAssociated variable to true and attach an ElementInternals object to the web component to give us the utilities necessary to implement form participation. We can do this via the attachInternals() function:

Now that is form-associated and we have ElementInternals attached, we need a way to send the values from ’s four subfields with the form once the form is submitted.

To do this, we must first select each input from the shadowRoot using the querySelector function and each input’s name attribute to select the elements with CSS. Once we have each input, we can create an event listener that updates what will be sent when the form is submitted.

The only problem is that since we’ll be within the element in the event listener, we must come back up to the custom element to run the update function. We can do this using the getRootNode() function and the host property:

Web component content validation

One other thing we can add to our web component is some content validation. We must ensure that a user can pay us easily, so correcting some common mistakes on the frontend can save us from card declines and similar issues over easily fixed errors.

If the content passes our validation tests, we give it the all-clear with the following:

While you might think that there are at least a few simple rules we could use for verifying names, like including at least one space or only using alpha characters, names don’t really conform to a standard, and unless you have a constraint further down in the process, I’d recommend leaving error correction off (except maybe for little Bobby tables).

Credit card numbers aren’t just random numbers, nor can all sixteen-digit numbers be credit card numbers (American Express uses 15 digits, but we’ll ignore them for now).

For credit cards, the first six digits represent the issuer (such as Mastercard, Visa, and Discover); the next nine are their customer’s account number; and the last number is a checksum that ensures the previous fifteen numbers are accurate, that is, no numbers are transposed and no random number was substituted.

This checksum uses the Luhn algorithm. There are a few transpositions and substitutes that pass the Luhn algorithm, but it catches the vast majority of simple errors:

The checkLuhn function also removes any non-digit characters, like hyphens, before it runs the algorithm, so we don’t need to worry about whether the user puts them in the field or not.

Expiration dates must be a valid future date, which allows us to provide some error correction here.

Lastly, the CVV code must be at least three digits (American Express uses four, but we’ll continue to ignore this edge case).

We can test this with JavaScript, but HTML also has built-in ways to handle testing using the maxlength attribute and the pattern attribute. Remember, we must still hook into setValidity for the form to check the input against the pattern:

For testing with HTML, use the following:

For JavaScript, use this code:

If the CVV code validation is the last one in your list and it’s valid, but the expiration date or the credit card number isn’t, then those errors will skip and the form will go through.

We could reset error flags individually, but since we have multiple typeMismatch errors, a fixed expiration date would wipe out an error on the credit card number.

Thus, we’ll save the errors in an array and process them all at once at the end. If we don’t collect any errors, the content is valid and can send it through the following:

Conclusion

Well, there you have it, you built a full web component you can use as-is or take and make variations to. In fact, there’s a whole lot more validation you can do than what’s covered here. Happy web componenterizer-izing!

LogRocket: Full visibility into your web and mobile apps

LogRocket is a frontend application monitoring solution that lets you replay problems as if they happened in your own browser. Instead of guessing why errors happen, or asking users for screenshots and log dumps, LogRocket lets you replay the session to quickly understand what went wrong. It works perfectly with any app, regardless of framework, and has plugins to log additional context from Redux, Vuex, and @ngrx/store.

In addition to logging Redux actions and state, LogRocket records console logs, JavaScript errors, stacktraces, network requests/responses with headers + bodies, browser metadata, and custom logs. It also instruments the DOM to record the HTML and CSS on the page, recreating pixel-perfect videos of even the most complex single-page and mobile apps.

Источник

Invalid value for field credit card number

React Credit Card Input

A credit/debit card input field for React

Input renderer props

Custom input renderer usage

Custom text labels usage

Contributing to react-credit-card-input is easy! With four simple steps:

Источник

Credit Card Number Invalid

Original Post

Hi, I keep trying to purchase the downloadable version of The Sims 3: Showtime from Origin but it keeps telling me that my credit card number is invalid. I used the same card yesterday to purchase Ambitions and Generations and it worked fine. I’m positive that all of my information is correct and I have enough money to purchase it.

Re: Credit Card Number Invalid

In that case, please get in contact with an EA Game Advisor.

You need to log in with your Origin account and then choose «Product», «Category», and «Platform» to see the contact options. Please choose phone or chat as contact option.

Your friendly neighbourhood forum admin.

Re: Credit Card Number Invalid

Did all of this, 4 times, 4 different advisors and I still get the invalid card error. Now they are saying they have «escalated my case to specialist». Over a 4.99 purchase for Origin Access?! We used the same card just moments before to buy Origin Access for my fiance’ (who lives with me) so we have same address and everything but it will not let him purchase the Origin Access for me. Even bought it months ago for my eldest with no problem (who also lives at the same address). I have been super nice and cooperative and now they will not talk to me at all because they claim they can’t because «only the specialist can fix it now». I have never had problems with Origin before but my fiance’ went through the same thing when trying to buy Battlefront through Origin. It’s getting very frustrating. Now the 5th advisor is telling me I have to be patient? I shouldn’t even be having this problem AT ALL. I can’t even enter my card into the billing area on the website!

Re: Credit Card Number Invalid

@Phurigigs @realratmom Let me start this reply by saying the is an open public forum for users by users and accounts can not be accessed here. I think EA has a third party handling its financial transactions due to international money value conversions. I can state that certain cards seem to cause issues. If the system is claiming invalid card usually (not always) that the card number entered does NOT equate to the number on the back of the card (guessing this is a checksum number) or the card issuer has flagged your card as being stolen. I had a card locked when I began ordering stuff for foreign countries. A call the issuer cleared up the problem. Most of the problems with cards are caused by the issuing agent (the bank, credit union, etc). Have you tried a different means of payment? I recommend calling the number on the back of the card. Paypal is another alternate payment system which seems to eliminate issues. If you still want to use that payment course you’ll just have to wait until EA sorts it out. I’m guessing that EA customer service can only escalate this issue to the proper department. Either contact the number on the back of the card or use a different paymant system to hasten an end.

I do not work for EA or associated with EA other then helping other users in the forums.

Re: Credit Card Number Invalid

If I had another card to use instead I would have. The issue has been cleared up. The problem ended up being when you enter the card info it also wants you to enter the name on said card. I was entering the actual name (which was not my own) and for some odd reason it didn’t work. This morning autofill entered my name in place of his and then the card worked. This proves that there is a flaw in the transaction buffers because I should not be able to put my name in the same spot as the card name since my name is not on his card. So even if it is a 3rd party they have assigned to deal with transactions they need to address this.

Источник

React Native Form Management Tutorial — Building a Credit Card Form

Forms are pretty common in all kinds of apps. That’s why developers are often trying to simplify the process of building forms. I’ve built some custom solutions before, also used all the popular form management libraries so far. I think react-hook-form is the best one in terms of developer experience and customization.

It’s pretty straightforward to use it on the web. You simply create your HTML input elements and register them. But it’s a little harder with React Native. So I’ll try describing each step I took to be able to make my approach more clear. I’ll be building a credit card form in this tutorial but the tutorial should be helpful with building any types of forms. Most of the components we’ll be building here can be reused as well.

You may find the full version of this component on Github. I also ported the React Native code into the web thanks to react-native-web. You may play with it on my blog.

Table of Contents

Starting with a simple UI

For this tutorial, I used this clean design I found on Dribbble as the design reference. I’ve also used the TextField component I built in my last post. Here is the CreditCardForm component that generates the UI with simple local state variables:

I’m simply including the form in a ScrollView on the App component:

Integrating react-hook-form

Using react-hook-form provides subtle benefits over building form logics manually. The most obvious advantages are building more readable code, easier maintenance, and more reusability.

So let’s start by adding react-hook-form to our project:

This is the minimum code block needed to build a React Native form with react-hook-form :

And FormTextField will look like this:

After those changes, the new version of CreditCardForm will look like below. You may check out the full diff on Github.

Improving reusability

I had to make a decision at this point in terms of the better reusability of the form. It’s about where to create our form initially using the useForm method. We have two options:

Here is one example about the second option. In this example, we are watching the card number value changes and updating the button title based on that:

I’ll go with the second option.

Validations

For the tutorial, I’ll delegate the validations logic to Braintree’s card-validator library to keep us focused on the form part. Now I need to define rules for our FormTextField components. rules object will contain two properties:

Our input fields will need to look like below. You may check out the full diff of validation rules on Github.

After making those changes, we’ll see the following screen when clicking on the PAY button:

Triggering validations

The validation trigger scheme is configurable with react-hook-form without any custom code. mode parameter configures the validation trigger scheme:

onChange : Validation will trigger on the submit event and invalid inputs will attach onChange event listeners to re-validate them

onBlur : Validation will trigger on the blur event.

onTouched : Validation will trigger on the first blur event. After that, it will trigger on every change event.

While those modes are enough for most cases, I wanted a custom behavior with my form. I want to provide fast feedback to the user but it shouldn’t be too fast as well. This means I want to validate my input right after the user enters enough characters. That’s why I created an effect in FormTextField that watches the input value and triggers the validation when it passes a certain threshold( validationLength prop here).

Please note that this is not required for the form to function at all, and it may cost some performance penalty if your validation method is intensive.

Formatting input values

To make the card number and expiration input fields look good, I’ll format their values instantly with each new character users enter.

There are some libraries that do a similar job but I want to create a simple solution on my own. So I created utils/formatters.ts file for this purpose:

Now we’ll simply create a formatter prop for FormTextField component, and pass the value it returns to onChange :

I created some tests to make sure format utilities return the expected values using jest’s test.each method. I hope it’ll make it easier for you to understand what those utils methods are doing:

Focusing on the next field

I believe this is a good UX pattern for forms: focusing on the next input field when the user has filled the current input. There are two possible ways to understand when the user is done:

I’ll use the first method on the cardholder name input, and the second one on the rest. It’s simply because we don’t know when the cardholder’s name is completed, unlike other ones.

Here are the steps I followed to build this:

2. Created onValid prop on FormTextField component, and modified the effect that triggers validation:

3. Created a ref for each component and triggered the next input ref’s onFocus method:

You can check out the full diff of this section on Github.

Displaying the card type icon

This is our last feature. I created the CardIcon component for this, and I’ll pass it to the input through the endEnhancer prop.

Testing

I will create some tests for the critical parts of the form to make sure we’ll know instantly when they are breaking, which are validations, value formattings, and form submission.

I love using react-native-testing-library for my tests. It lets you create tests similar to user behavior.

I’m also using bdd-lazy-var, the tool I learned about in my last job. I still pick it up on my tests as it helps to describe the test variables in a clean and more readable way.

So I’ll set up a form with useForm and pass it through the FormProvider just like using it on an actual screen. I’ll then change input values, test validation results, and check the result react-hook-form returns when I submit the button. Here is the base setup I’ll use in all of my test cases:

Testing credit card number validation

I have three assertions in this test case:

Testing expiration date validation

Testing with passed and valid dates, and checking the validation error is displayed/hidden:

Testing the form submission

Entering correct values to each input and clicking on the submit button. I then expect the onSubmit method is called with the correct and formatted data:

Output

Again, you can find the full version on Github. Please feel free to send me a message over Twitter if you have any feedback or questions.

Источник