Hosted Fields
Events
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 |
| ||||||
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 |
| ||||||
card | Object | The determined card type. Learn more about card type. |