You can subscribe to events using the onFieldEvent callback. This allows you to hook into focus, blur, and fieldStateChange.
Javascript
// ...
hostedFields: {
onFieldEvent: function (event) {
if (event.type === 'focus') {
// Handle focus
} else if (event.type === 'blur') {
// Handle blur
} else if (event.type === 'fieldStateChange') {
// Handle a change in validation or card type
console.log(event.isValid); // true|false
if (event.card) {
console.log(event.card.type);
// visa|master-card|american-express|diners-club|discover|jcb|unionpay|maestro
}
}
}
}
// ...
The event object will return the following:
Key
Type
Description
type
String
focus
Fired when the input becomes focused
blur
Fired when the input loses focus
fieldStateChange
When any state has changed within an input including: validation, focus, card type detection, etc.
isEmpty
Boolean
Whether or not the user has entered a value in the input
isFocused
Boolean
Whether or not the input is currently focused
isPotentiallyValid
Boolean
A determination based on the future validity of the input value. This is helpful when a user is entering a card number and types "41". While that value is not valid for submission, it is still possible for it to become a fully qualified entry. However, if the user enters "4x" it is clear that the card number can never become valid and isPotentiallyValid will return false.
isValid
Boolean
Whether or not the value of the associated input is fully qualified for submission
target
Object
container
Reference to the container DOM element on your page associated with the current event.
fieldKey
A String mapping to the currently associated field: "number"
"cvv"
"expirationDate"
"expirationMonth"
"expirationYear"
"postalCode"
card
Object
The determined card type. Learn more about card type.
If you accept cookies, we’ll use them to improve and customize your experience and enable our partners to show you personalized PayPal ads when you visit other sites. Manage cookies and learn more