Dot All Lisbon – the official Craft CMS conference – is happening September 23 - 25.

Payment Form Model

The payment form model is a special model used to validate a credit card when payment is submitted. It is never saved to the server. It is only created when making a payment, and returned to the template if validation errors were found on the model or from the payment gateway. When returning after a validation error a paymentForm variable will be available to the template.

The paymentForm model is usually only used by onsite gateways. In addition to the following attributes some gateways require other additional ones. See the Payment Gateways page for gateway specific information.

Model Attributes

The follow attributes make up the payment form model.

token

If a token is found on the payment form, no validation of other field is performed and the data is ignored.

The token represents a pre validated credit card and is provided by a gateway’s client-side JavaScript library. For example Stripe.js

firstName

The first name of the customers credit card.

Validation: required field

lastName

The last name of the customers credit card.

Validation: required field

month

Integer only number representing the month of credit card expiry.

Validation: required field, Min:1 Max: 12

year

Integer only number representing the year of credit card expiry.

Validation: required field, Min: current year: 2016 Max: Current year plus 12 e.g 2028

cvv

Integer only number found on the back side of the card for security.

Validation: minimum char length: 3, maximum char length: 4

number

The credit card number itself.

Validation: Luhn algorithm

Example Usage

Below is an example of a payment form using the payment form model.

{{ getCsrfInput() }}

{% set formValues = {
  firstName: paymentForm is defined ? paymentForm.firstName : (cart.billingAddress ? cart.billingAddress.firstName : ''),
  lastName: paymentForm is defined ? paymentForm.lastName : (cart.billingAddress ? cart.billingAddress.lastName : ''),
  number: paymentForm is defined ? paymentForm.number : '',
  cvv: paymentForm is defined ? paymentForm.cvv : '',
  month: paymentForm is defined ? paymentForm.month : 1,
  year: paymentForm is defined ? paymentForm.year : currentYear,
} %}

{% if paymentForm is defined %}{{ paymentForm.getError('firstName') }}{% endif %}

{% if paymentForm is defined %}{{ paymentForm.getError('lastName') }}{% endif %}

{% if paymentForm is defined %}{{ paymentForm.getError('number') }}{% endif %}

  {% for month in 1..12 %}
    <option value="{{ month }}" {% if formValues.month == month %}selected{% endif %}>{{ month }}</option>
  {% endfor %}
{% if paymentForm is defined %}{{ paymentForm.getError('month') }}{% endif %}

  {% for year in currentYear-1..(currentYear + 12) %}
    <option value="{{ year }}"{% if formValues.year == year %}selected{% endif %}>{{ year }}</option>
  {% endfor %}
{% if paymentForm is defined %}{{ paymentForm.getError('year') }}{% endif %}

{% if paymentForm is defined %}{{ paymentForm.getError(cvv) }}{% endif %}