Validation on optional phone fields

Hi @peter8nss,

Trust you are doing good and thank you for reaching out to us.

An out-of-the-box solution is not available for this. We have now pinged our developers to check if a workaround could be suggested and we’ll update you here once we have more feedback on this as soon as possible.

Kind Regards,
Nebu John

Hi @peter8nss,

Could you please check if the following workaround helps?

<?php
add_filter( 'forminator_custom_form_submit_errors', function( $submit_errors, $form_id, $field_data_array ) {
    // Add your form IDs here.
    $form_ids = array( 6 );
    // Change this to the message that you want to show.
    $message = 'Please enter one of the phone numbers.';
    if ( in_array( intval( $form_id ), $form_ids, true ) ) {
        $submitted_data = wp_list_pluck( $field_data_array, 'value', 'name' );
        if ( empty( $submitted_data['phone-1'] ) && empty( $submitted_data['phone-2'] ) ) {
            $submit_errors[]['phone-1'] = $message;
            $submit_errors[]['phone-2'] = $message;
        }
    }
    return $submit_errors;
},15,3);

Please note, that you need to update the form ID and Phone field IDs with your forms details. The code could be added to your child theme’s function.php file or using a mu-plugin. I hope the following guide comes in handy: https://wpmudev.com/docs/using-wordpress/installing-wordpress-plugins/#installing-mu-plugins

Please test the code using a dev/staging environment before pushing it to the live website and please feel free to get back to us if you need any further clarification.

Kind Regards,
Nebu John

Hi @peter8nss

We haven’t heard from you in a while, I’ll go and mark this thread as resolved. If you have any additional questions or require further help, please let us know!

Kind Regards,
Kris

Apologies for the delay in testing the workaround. I don’t think it works, because if there is a phone validation error I can’t submit, so hook ‘forminator_custom_form_submit_errors’ doesn’t fire.

Hi @peter8nss

Thanks for response!

I checked it and you’re right – it will not work this way.

It works if you change validation settings in field to “None” – otherwise the “national” validation takes precedence over this and require number in correct format. Since it’s set for both fields, it requires it for both of them too.

Furthermore, since the first field is set to required, then the first one will always be required despite the code.

One way to deal with it is to switch validation for both fields to “none” and switch both fields to be not required.

Then the code would be triggered correctly and only allow submission if one of the fields is filled-in, with proper error message. But then the validation for the number format would need to be added directly in the custom code itself which would be very tricky, especially with UK format which is, kind of, “variable” in both the actual format and the number of ways number can be entered.

But perhaps it would be enough to validate simply by the minimum number of characters?

If yes, you could use this code (slightly modified one shared previously):

`<?php
add_filter( ‘forminator_custom_form_submit_errors’, function( $submit_errors, $form_id, $field_data_array ) {
// Add your form IDs here.
$form_ids = array( 3010 );
// Change this to the message that you want to show.
$message = ‘Please enter one of the phone numbers.’;
if ( in_array( intval( $form_id ), $form_ids, true ) ) {
$submitted_data = wp_list_pluck( $field_data_array, ‘value’, ‘name’ );
if ( empty( $submitted_data[‘phone-1’] ) && empty( $submitted_data[‘phone-2’] ) && (strlen( $submitted_data[‘phone-1’])<4) && (strlen( $submitted_data[‘phone-2’] ) < 4 ) ){
$submit_errors[][‘phone-1’] = $message;
$submit_errors[][‘phone-2’] = $message;
}
}
return $submit_errors;
},9,3);`

You’d need to replace number 3010 with your form ID and replace phone-1 and phone-2 (in every place) with your phone fields IDs respectively. Also the number 4 (two occurrences) should be replaced with the minimum number of characters allowed (so shorter numbers would be considered invalid).

Then you would still need to set both fields as not required and switch validation to “none” (but you could add a placeholder to show example number) and it should work then.

Kind regards,
Adam

Coding my own (complex) validation when the product already has it seems like a somewhat backward step.

As far as I understand it, “required” and “phone format validation” are separate validation checks (and they can be selected independently). Would it be possible for the “phone format validation” to let through blank as a valid number? Leaving it to the “required” check to reject it (or letting it through if optional).

Hi @peter8nss

Yes, I understand that coding full validation would be a “step backward”.

My point here was that the built-in validation and the “required” option would always be prevailing over the shared code.

The “required” setting can be disabled safely because the code will make field required anyway but if validation is set then even with non-required field, validation “expects” correct number (as e.g. “+44” prefix only is not full valid number).

So if we want to keep that enabled, I need to consult our developers again on how to possibly modify the code to make it work together with validation enabled.

I’ve asked them already to look into it and check. I’m not sure at this point what it would require “code-wise” so we’ll need to wait for their response.

We’ll update you here again once we got feedback but I would appreciate some patience as our developers are dealing with a lot of complex tasks on daily basis.

Best regards,
Adam

Fully appreciate there may be a delay in this getting changed. Just keen that this is eventually sorted. I look forward to your feedback in due course.

Please remember my case is an “optional 2nd phone number”. I want a phone number that is either:

• Empty, or
• Valid

So my settings would be

• Require=Optional
• Validation=National

Hence, my suggestion that this might be achieved if the validation patterns were extended to include a blank number as valid. For those who required a valid number, their settings would be:

• Require=Required
• Validation=National

So although blank would be passed by the national validation, it would still be thrown out by the required check.

Hi @peter8nss

Please check if this will help. Code suggsted by our SLS Team:

<?php
add_action( 'wp_footer', 'wpmudev_phone_field_validation_fix', 9999 );
function wpmudev_phone_field_validation_fix(){
	global $post;
        if ( is_a( $post, 'WP_Post' ) && !has_shortcode( $post->post_content, 'forminator_form' ) ) {
            return;
        }
	?>
	<script type="text/javascript">
	jQuery(document).ready(function($) {
		setTimeout(function() {
			$('.forminator-custom-form').trigger('after.load.forminator');
		}, 100);

		$(document).on('after.load.forminator', function(e, form_id) {
            if ( e.target.id == 'forminator-module-6' ) { //Please change the form ID
                $('.forminator-button-submit').on('click', function(){
                    $('.forminator-field-phone').each(function(){
                        var phone_no = $(this).find('input').intlTelInput("getNumber");
                        phone_no = phone_no.replace('+', '');
                        var dial_code = $(this).find('input').intlTelInput("getSelectedCountryData").dialCode;
                        if ( phone_no == dial_code ) {
                            $(this).find('input').val('');
                        }
                    });
                });
            }
		});
	});
	</script>
	<?php
}

add_filter( 'forminator_custom_form_submit_errors', function( $submit_errors, $form_id, $field_data_array ) {
	
	// Add your form IDs here.
	$form_ids = array( 6 );
	// Change this to the message that you want to show.
	$message = 'Please enter one of the phone numbers.';
	
	if ( in_array( intval( $form_id ), $form_ids, true ) ) {
		$submitted_data = wp_list_pluck( $field_data_array, 'value', 'name' );
		if ( empty( $submitted_data['phone-1'] ) && empty( $submitted_data['phone-2'] ) ) {
			$submit_errors[]['phone-1'] = $message;
			$submit_errors[]['phone-2'] = $message;
		}
	}
	return $submit_errors;
},21,3);

In the code 6 should be replaced with user’s form ID.

Kind Regards,
Kris

Thanks for the suggestion. I think I’ll live with the optional phone number being unvalidated as my workaround until the plugin code fix comes through.