Skip to content

Instantly share code, notes, and snippets.

@mmeo

mmeo/shopify_validation.js Secret

Last active Dec 16, 2015
Embed
What would you like to do?
//////***Validate Billing Zip Code for US and Canada***/////
//when billing zip code is clicked, edited, etc
$("#subscription_payment_profile_attributes_billing_zip").change(function(){
//get billing zip code value
var zipCode = $('#subscription_payment_profile_attributes_billing_zip').val();
//test for valid billing US zip code
var isValidZipUS = /(^\d{5}$)|(^\d{5}-\d{4}$)/.test(zipCode);
//test for valid billing Canada zip/postal code
var isValidZipCanada = /^[ABCEGHJKLMNPRSTVXY]{1}\d{1}[A-Z]{1} *\d{1}[A-Z]{1}\d{1}$/.test(zipCode);
//get the billing country chosen by the user
var billing_country = $('#subscription_payment_profile_attributes_billing_country').val();
//if invalid United States Billing Zip Code
if (isValidZipUS == '0' && billing_country == 'US') {
$( "label[for='subscription_payment_profile_attributes_billing_zip']" ).append( "<b id='validation_billing_zip_error_US' style='color:red; font-weight: 400;')> Not A Valid US Zip Code</b>" );
}
//if valid United States billing Zip Code
else if (isValidZipUS == '1' && billing_country == 'US') {
$( "#validation_billing_zip_error_US" ).hide();
}
//if invalid Canada Billing Zip Code
else if (isValidZipCanada == '0' && billing_country == 'CA') {
$( "label[for='subscription_payment_profile_attributes_billing_zip']" ).append( "<b id='validation_billing_zip_error_CA' style='color:red; font-weight: 400;')> Not A Valid Canada Postal Code</b>" );
}
//if valid canada billing Zip Code
else if (isValidZipCanada == '1' && billing_country == 'CA') {
$( "#validation_billing_zip_error_CA" ).hide();
}
});
//////***Validate Shipping Zip Code for US and Canada***/////
//when shipping zip code is clicked, edited, etc
$("#subscription_customer_attributes_zip").change(function(){
//get shipping zip code value
var shipping_zipcode = $('#subscription_customer_attributes_zip').val();
//test for valid shipping US zip code
var isValidZipUS_shipping = /(^\d{5}$)|(^\d{5}-\d{4}$)/.test(shipping_zipcode);
//test for valid shipping Canada zip/postal code
var isValidZipCanada_shipping = /^[ABCEGHJKLMNPRSTVXY]{1}\d{1}[A-Z]{1} *\d{1}[A-Z]{1}\d{1}$/.test(shipping_zipcode);
//get the shipping country chosen by the user
var shipping_country = $('#subscription_customer_attributes_country').val();
//if invalid United States Shipping Zip Code
if (isValidZipUS_shipping == '0' && shipping_country == 'US') {
$( "label[for='subscription_customer_attributes_zip']" ).append( "<b id='validation_shipping_zip_error_US' style='color:red; font-weight: 400;')> Not A Valid US Zip Code</b>" );
}
//if valid United States Shipping Zip Code
else if (isValidZipUS_shipping == '1' && shipping_country == 'US') {
$( "#validation_shipping_zip_error_US" ).hide();
}
//if invalid Canada Shipping Zip Code
else if (isValidZipCanada_shipping == '0' && shipping_country == 'CA') {
$( "label[for='subscription_customer_attributes_zip']" ).append( "<b id='validation_shipping_zip_error_CA' style='color:red; font-weight: 400;')> Not A Valid Canada Postal Code</b>" );
}
//if valid canada Shipping Zip Code
else if (isValidZipCanada_shipping == '1' && shipping_country == 'CA') {
$( "#validation_shipping_zip_error_CA" ).hide();
}
});
This script will validate the zip/postal codes for US/Canada in a Chargify payment page, so they will be correctly validated when pushed to Shopify.
How it works: Select country, then enter zip, immediately notifies user of an error if zip/postal code does not match regex for US/Canada zip/postal codes.
Test functionality here: https://chargify-sandbox-34.chargify.com/subscribe/zyx3nvq2smvd/product
Real Life Example: https://chargify-sandbox-34.chargify.com/subscribe/5rp643cdrddp/product-2
US syntax: 5 digits
Canada synatax example: A1A 1A1
Known limitations:
1. If you chose a country, enter a zip, but then change your country, it will not validate
2. The form will still submit if the zip code is not validated (however, users are notified of an error the moment they click out of the zip code box).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.