How to create Stripe elements postal code that accepts UK postcodes?

Vedran Šego picture Vedran Šego · Apr 21, 2017 · Viewed 10.8k times · Source

I'm creating a payment form with separate Stripe Elements:

var stripe = Stripe(...);
var elements = stripe.elements();
...
var postalCode = elements.create('postalCode');
postalCode.mount('#postalCode');

This creates a field that accepts only digits. However, the UK's post codes contain letter as well. How do I allow these too? I want the user to be able to input pretty much any possible post code in the world.

Answer

mahemoff picture mahemoff · Dec 13, 2017

As mentioned in comments, the form dynamically adjusts based on the card you enter, since the card indicates its country. However, it doesn't seem to validate effectively. I was able to create a valid test order with invalid UK postcode.

Stripe has test card numbers for many countries. Try entering them into your Elements forms.

Form when user types Stripe's generic (US) test Visa card shows "ZIP" (it shows ZIP when empty too):

Form with Stripe's generic (US) Visa card

The same form when user types in Stripe's test UK Visa card changes to showing "Postcode" during typing:

Form with Stripe's UK test card