Setting a Max Length on Checkout Fields

Let's say your shipping service only accepts 30 characters in each address line but your users keep entering too much data. You can use the snippet below to update the 'maxlength' attribute on your shipping address fields. This will force users to keep their addresses shorter. It also serves as a good example of how to update the form every time after it is dynamically rendered.

Add Javascript

Put this javascript in the footer of your checkout template. You can also put it in the code injection section of the template configuration settings in the admin. Just put it in the “Custom Footer” box.

{% if context == 'checkout' %}
<script type="text/javascript" charset="utf-8">
FC.client.on('render.done', function() {
    jQuery("#shipping_address1, #shipping_address2").attr("maxlength", "30");
});
</script>
{% endif %}

Site Tools