Support

Account

Register Login

Home › Forums › Front-end Issues › acf_form with custom validation message

Solving

acf_form with custom validation message

  • I am working with acf_form on a front-end page that allows the user to update their password. I have two fields: New Password and Confirm New Password.

    I have used jQuery to check if the values of the fields match but I can’t update the validation message if the user enters incorrect data.

    I would like to change:
    Validation Failed. One or more fields below are required.

    to:
    {MY MESSAGE HERE}

    I know the string is within: acf.l10n but I do not know how to change this (jQuery newbie). Please can someone point me in the right direction or offer some advice on how to update the default message?

    Thanks.

  • ACF already does validation and you can validate one field against another field using those filters. Here’s an example

    
add_filter('acf/validate_value/name=password2', 'my_validated_password_filter', 10, 4);
function my_validated_password_filter($valid, $value, $field, $input) {
  if (!$valid) {
    return $valid;
  }
  // field key of the field you want to validate against
  $password_field = 'field_0123456789abc';
  if ($value != $_POST['acf'][$password_field]) {
    $valid = 'Does Not Match Password';
  }
  return $valid;
}

  • Thanks John for getting back to me.

    I have tried this with out success. I’m not sure this works on the front-end (not within admin) when using acf_form() – or should it?

  • …deleted…

  • It should work on the front end as well as the back end.

    Check you acf_form setup. Are you calling acf_form_head(); before get_header(); and make sure that your theme is also calling wp_footer(); If something here is wrong it could be causing the JS to error.

    Another thing is that if you have the field marked as required then if it’s left blank you’ll get the standard ACF error message. If you want to completely override that remove the check at the top of the function that returns if the field is already not valid

    
add_filter('acf/validate_value/name=password2', 'my_validated_password_filter', 10, 4);
function my_validated_password_filter($valid, $value, $field, $input) {
  // field key of the field you want to validate against
  $password_field = 'field_0123456789abc';
  if ($value != $_POST['acf'][$password_field]) {
    $valid = 'Does Not Match Password';
  }
  return $valid;
}

  • Hey John,

    Unfortunately, I can confirm that I have acf_form() before get_header() and my theme is calling wp_footer().

    I have tried removing the required fields but that didn’t make any difference.

    Also, I don’t get any JS errors in chromes console…

    I guess it’s not going to work. Thanks your your suggestions.

  • I just did a test on one of my test sites to make sure it was working and I wasn’t mistaken about it working on the front end.

    I created to fields text1 and text2, but it should work with any 2 fields

     
add_action('acf/validate_value/name=text1', 'validate_2_fields', 10, 4);
function validate_2_fields($valid, $value, $field, $input) {
  $second = 'field_57192c0b5b1ee';
  if ($value != $_POST['acf'][$second]) {
    $valid = 'values must match';
  }
  return $valid;
}

    There is one other thing that might cause it, and that’s a php error during the ajax call, but if you’re getting the standard error for a required field being left blank then that’s not the case.

    Check the field names/keys to make sure you’re using the right ones. The only other thing I can think of is that the fields are part of a repeater or some other nested type of field, but that doesn’t seem likely.

    The last thing to check is the field names, try changing them. The names of fields can possibly cause issues, but I’m really stretching for possible solutions.

    If everything still looks okay then you’ve probably got some other plugin or something causing a conflict. Try disabling plugins or changing themes to see if that clears up the problem.

  • Hey John, thanks for double checking this for me… I’m sure it’s something to do with my theme – although I have no idea how to debug the issue.

    One thing just to clear up, I am using this jQuery to check the validation – could this be the reason the filter isn’t working:

    jQuery(document).ready(function($) {

	// Validate New Password fields
	$(document).on('acf/validate_field', function(e, field){
		
		// vars
		$field = $(field);
		$new_password = $('#acf-field-new_password').val();
		$confirm_password = $('#acf-field-confirm_new_password').val();
		
		// set validation to false on this field
		if($new_password != $confirm_password) {

			$field.data('validation', false);

		}
			
	});

});

  • It probably has something to do with not using the standard method of validation. You’re either going to need to produce and output the error in your custom script or remove it and let ACF deal with it normally. I tend to only build custom code when it’s something I can’t do with a simple ACF filter.

  • This reply has been marked as private.
Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘acf_form with custom validation message’ is closed to new replies.