jessepollak / card

:credit_card: make your credit card form better in one line of code
MIT License
11.66k stars 1.48k forks source link

Set card type methods #192

Closed zainzafar closed 8 years ago

zainzafar commented 9 years ago

Our payment gateway fires an event which tells us the card type (visa/master card/amex). Is it possible to have the an api method or somethign which we can use to show just the card type selected, without any number/name/expiry etc? Something like:

$('.....').card('type', 'visa');
// displays visa card design without name/number

$('....').card('security_code');
// Automatically flips for Visa/mastercard and not for amex
kaizensoze commented 8 years ago

It's a bit of a hack due to the code duplication, but you could throw this in the Card class in card.coffee:

# amex, dankort, dinersclub, discover, jcb, laser, maestro, mastercard, unionpay, visa, visaelectron, elo
setType: (cardType) ->
  unless QJ.hasClass @$card, cardType
    QJ.removeClass @$card, 'jp-card-unknown'
    QJ.removeClass @$card, @cardTypes.join(' ')
    QJ.addClass @$card, "jp-card-#{cardType}"
    QJ.toggleClass @$card, 'jp-card-identified', (cardType isnt 'unknown')
    @cardType = cardType

and then do:

var card = new Card({
    form: document.querySelector('form'),
    container: '.card-wrapper'
});
card.setType('visa');
jessepollak commented 8 years ago

This is in the scope of #184 — @kaizensoze if you'd be interested in making that into a PR that solves the general problem outlined in #184, I'd be super excited!