Would you like to add address field validation when using the Address form field on an Authorize.net payment form? By default, Authorize.net enforces a 60 character max address limit for both Address 1 and Address 2 lines on the Address form field and the users won’t know this until they hit Submit on your form.
The error message that Authorize.net displays isn’t a very user-friendly message and to your average visitors won’t understand what the message is trying to relay.
Payment was declined by Authorize.Net. API: (E00003) The 'AnetApi/xml/v1/schema/AnetApiSchema.xsd:address' element is invalid β The value XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX is invalid according to its datatype 'String' β The actual length is greater than the MaxLength value.
Utilizing the power of JavaScript, we’re going to adjust the message to make this more understandable to our visitors. In this tutorial, we’ll walk you through each step on how to achieve this.
Creating the form
First, we’ll need to create a form using the Authorize.net addon.
We’ll be including the Address field in the form so that we can capture and store this address with the Authroize.net transaction detail.
If you need any help in creating a payment form for Authorize.net, please check out this documentation.
Mapping the form fields
Once you’ve created the form and added your fields, you’ll need to also map these fields to the correct place inside the Authorize.net transaction detail.
To complete this step, click on the Payments tab inside the form builder. Once there, click the Authroize.net tab and being assigning the form fields from your form to the correct fields within the transaction detail.
Adding address field validation
Now it’s time to add the snippet to your site. If you’re not sure where or how to add snippets to your site, please check out this tutorial.
/** * Add address validation for Authorize.net address fields * * @link https://wpforms.com/developers/how-to-add-address-field-validation-for-authorize-net/ */ function wpf_dev_authorize_address_validation( $fields, $entry, $form_data ) { // Optional, you can limit to specific forms. Below, we restrict output to // form #1463. if ( absint( $form_data[ 'id' ] ) !== 1463 ) { return $fields; } // check the field ID 3 to see if it's empty and if it is, run the error if ( strlen( $fields[3][ 'value' ] ) > 60 ) { // Check the field ID 3 and show error message at the top of form and under the specific field wpforms()->process->errors[ $form_data[ 'id' ] ] [ '3' ] = esc_html__( 'The characters for the address line must not exceed 60.', 'plugin-domain' ); } } add_action( 'wpforms_process', 'wpf_dev_authorize_address_validation', 10, 3 );
Please remember this snippet will only process on form ID 1463 and will only look at the Address field, which is field ID 3. You’ll need to update these ID numbers to match your own.
If you need any assistance in finding your form and field IDs, please review this tutorial.
Now when the users enter their address they will see an immediate address validation message if any line in the Address exceeds 60 characters.
And that’s all you need! Would you like to also send an invoice number to Authorize.net? Check out our tutorial on How to Send an Invoice Number Through to Authorize.net Payments.