There are four card components as listed below:
cardNumber
A component to accept card number.
placeholder for your card number field
hide brand icons, default is false
Returned Value
You can get the value of a component by calling
component.data().value. All returned
values of
component.data() can be found
here
contains the brand of the card visa, amex, mastercard, rupay
contains the cvv length for the given brand eg 4 for amex
let cashfree = Telr({
mode:"sandbox" //or production
});
let card = cashfree.create('cardNumber', {
values:{
placeholder: "Enter card number"
}
});
card.on('loaderror', function(data){
console.log(data.error)
})
card.mount("#mount-here");
card.on('ready', function(d){
console.log(card.data().value); //{brand: 'visa', cvvLength: 3}
//or
//console.log(d.value)
})
cardHolder
A component to accept card holder’s name.
You can pass values to a component using options cashfree.create(‘componentName’, options)
Returned Value
You can get the value of a component by calling
component.data().value. All returned
values of
component.data() can be found
here
contains the name of the card holder
let cashfree = Telr({
mode:"sandbox" //or production
});
let cardHolder = cashfree.create('cardHolder', {
values:{
cardHolder: 'Jane Doe'
}
});
cardHolder.on('loaderror', function(data){
console.log(data.error)
})
cardHolder.mount("#mount-here");
cardHolder.on('ready', function(d){
console.log(cardHolder.data().value)//{cardHolder: 'Jane Doe'}
//or
//console.log(d.value);
})
cardExpiry
A component to accept card expiry. This component does not accept any parameters.
Returned Value
You can get the value of a component by calling
component.data().value. All returned
values of
component.data() can be found
here
Returns the card expiry in MM/YY format.
let cashfree = Telr({
mode:"sandbox" //or production
});
let cardExpiry = cashfree.create('cardExpiry', {
values:{
//does not accept any value
}
});
cardExpiry.on('loaderror', function(data){
console.log(data.error)
})
cardExpiry.mount("#mount-here");
cardCvv.on('ready', function(d){
console.log(cardCvv.data().value); //{cardExpiry: '12/26'}
//or
//console.log(d.value)
});
cardCvv
A component to accept card cvv/cvc. This component does not accept any parameters.
Returned Value
This is a secure field and you cannot get values from this field.
let cashfree = Telr({
mode:"sandbox" //or production
});
let cardCvv = cashfree.create('cardCvv', {});
cardCvv.on('loaderror', function(data){
console.log(data.error)
})
cardCvv.mount("#mount-here");
cardCvv.on('ready', function(d){
console.log(cardCvv.data().value); //{cardCvv: '123'}
//or
//console.log(d.value)
});
