How to use the payment.formatCardNumber function in payment

To help you get started, we’ve selected a few payment examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github DefinitelyTyped / DefinitelyTyped / types / payment / payment-tests.ts View on Github external
import * as Payment from "payment";

const input = document.getElementById('input') as HTMLInputElement;

Payment.restrictNumeric(input);
Payment.formatCardNumber(input);
Payment.formatCardExpiry(input);
Payment.formatCardCVC(input);

const card = "1234 5678 9012 3456";

const cardType = Payment.fns.cardType(card);
Payment.fns.validateCardNumber(card);
Payment.fns.validateCardExpiry("1 / 20");
Payment.fns.validateCardExpiry("1", "20");
Payment.fns.validateCardCVC("123", cardType);
github medipass / react-credit-card-input / src / InputField.js View on Github external
handleCardNumberChange(e) {
    const cardNumber = e.target.value;
    const cardNumberLength = cardNumber.split(' ').join('').length;
    const cardType = payment.fns.cardType(cardNumber);
    const cardTypeInfo =
      creditCardType.getTypeInfo(creditCardType.types[CARD_TYPES[cardType]]) ||
      {};
    const cardTypeLengths = cardTypeInfo.lengths || [16];
    this.setState({
      cardImage: CARD_IMAGES[cardType] || placeholder,
      cardNumber
    });

    payment.formatCardNumber(document.getElementById('card-number'));

    this.setFieldValid();
    if (cardTypeLengths) {
      const lastCardTypeLength = cardTypeLengths[cardTypeLengths.length - 1];
      for (let length of cardTypeLengths) {
        if (
          length === cardNumberLength &&
          payment.fns.validateCardNumber(cardNumber)
        ) {
          document.getElementById('card-expiry').focus();
          break;
        }
        if (cardNumberLength === lastCardTypeLength) {
          this.setFieldInvalid('Card number is invalid');
        }
      }
github lorensr / react-payment / src / CardForm.js View on Github external
componentDidMount() {
    const { number, expiration, cvc, zip } = this.refs

    Payment.formatCardNumber(ReactDOM.findDOMNode(number).querySelector('input'))
    Payment.formatCardExpiry(ReactDOM.findDOMNode(expiration).querySelector('input'))
    Payment.formatCardCVC(ReactDOM.findDOMNode(cvc).querySelector('input'))

    if (zip) {
      Payment.restrictNumeric(ReactDOM.findDOMNode(zip).querySelector('input'))
    }
  }
github Automattic / jetpack / _inc / client / components / form / input-text.js View on Github external
componentDidMount: function() {
		const el = this.refs.input.getDOMNode();
		switch ( this.props.formatter ) {
			case 'cardNumber':
				Payment.formatCardNumber( el );
				break;
			case 'cardExpiry':
				Payment.formatCardExpiry( el );
				break;
			case 'cardCVV':
			case 'cardCVC':
				Payment.formatCardCVC( el );
				break;
		}
	},
github opencollective / opencollective-frontend / src / components / CreditCardForm.js View on Github external
componentDidMount() {
    Payment.formatCardNumber(this.refs.number);
    Payment.formatCardExpiry(this.refs.expiration);
  }

payment

A general purpose library for building credit card forms, validating inputs and formatting numbers. Base on jquery.payment by @stripe, but without the jQuery.

MIT
Latest version published 5 months ago

Package Health Score

71 / 100
Full package analysis