• Resolved dzamanakos

    (@dzamanakos)


    Hi, after updating from an old cf7 version (5.3.2) i’m having some problems with custom tag validations (the code worked in the version 5.3.2 ). I will not post all my code, but a part of it as i have many custom tags/validations etc.

    For example, I have a custom tag in the wpcf7_init action:
    wpcf7_add_form_tag( array( ‘customphone’, ‘customphone*’ ), ‘custom_fields_form_tag_handler’, array( ‘name-attr’ => true ) );

    In the function custom_fields_form_tag_handler I add the field data and the fields is printed in my form.

    I then use the filter :
    add_filter( “wpcf7_validate_customphone*”, ‘filter_wpcf7_validate_custom_fields’, 10, 2 );
    where i invalidate the field with some regexp:
    $result->invalidate( $tag, “Wrong format” );
    and i return the $result

    The invalidation is working, as i get to the main message div (wpcf7-response-output) that “Validation errors occurred. Please confirm the fields and submit it again.”

    If i enter the correct data the form is submitting and i get the email with the data as expected.
    The problem is that it stopped to add the “wpcf7-not-valid” class in the custom tag field and doesnt show the invalidation message “Wrong format” under the field. Also it doesnt show the “Please fill the required fields.” if i leave the field empty.
    The “Please fill the required fields.” error is shown in other text fields, just not in my custom tag fields.

    Is there any documentation about the changes of custom tags from version 5.3.2 to the last version and validation of these custom tags that i can read and find out what changed?

    best,

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Takayuki Miyoshi

    (@takayukister)

    Where can we see the website in question?

    Thread Starter dzamanakos

    (@dzamanakos)

    Hi, i did setup a test wordpress with CF7 and added a simplified code for 1 custom tag from my previous integration :

    https://wp.vlax.gr/contact/

    The code i’m using for the field “Custom phone number” is the one below:

    add_action( 'wpcf7_init', 'custom_add_form_tags' );
    function custom_add_form_tags() {
        wpcf7_add_form_tag( array( 'customphone', 'customphone*' ), 'custom_fields_form_tag_handler', array( 'name-attr' => true ) );
    }
    
    add_filter( "wpcf7_validate_customphone*", 'filter_wpcf7_validate_custom_fields', 10, 2 );
    
    // Validate the number to be in format +XXXXXXXXXXX
    function validatecustomerphonenumber($str) {
     if (preg_match('/^[+]{1}\d{12}$/', $str)) {
      return true;
     }
     return false;
    }
    
    
    function filter_wpcf7_validate_custom_fields( $result, $tag ) {
       $customnumfield = $tag->name;
       if ( !validatecustomerphonenumber($_POST[$customnumfield]) ) {
    	   $result->invalidate( $tag, "Phone number should be in the format of +302100000000" );
       }
       return $result;
    };
    
    function custom_fields_form_tag_handler( $tag ) {
        if ( empty( $tag->name ) ) { return ''; }
        if ( strpos($tag->type, '*') !== false ) {
            $tag->type = 'text*';
            $tag->basetype = 'text';
        }
        else {
          $tag->type = 'text';
          $tag->basetype = 'text';
        }
        $validation_error = wpcf7_get_validation_error( $tag->name );
        $class = wpcf7_form_controls_class( $tag->type );
        $class .= ' wpcf7-validates-as-custom-field';
        if ( $validation_error ) {
            $class .= ' wpcf7-not-valid';
        }
        $atts = array();
        $atts['class'] = $tag->get_class_option( $class );
        $atts['id'] = $tag->get_id_option();
        $atts['tabindex'] = $tag->get_option( 'tabindex', 'signed_int', true );
        if ( $tag->has_option( 'readonly' ) ) { $atts['readonly'] = 'readonly'; }
        if ( $tag->is_required() ) { $atts['aria-required'] = 'true'; }
        $atts['aria-invalid'] = $validation_error ? 'true' : 'false';
        $value = (string) reset( $tag->values );
        if ( $tag->has_option( 'placeholder' ) || $tag->has_option( 'watermark' ) ) {
            $atts['placeholder'] = $value;
            $value = '';
        }
        $value = $tag->get_default_option( $value );
        $value = wpcf7_get_hangover( $tag->name, $value );
        $atts['value'] = $value;
        if ( wpcf7_support_html5() ) {
            $atts['type'] = $tag->basetype;
        } else {
            $atts['type'] = 'text';
        }
        $atts['name'] = $tag->name;
        $atts = wpcf7_format_atts( $atts );
        $html = sprintf(
            '<span class="wpcf7-form-control-wrap %1$s"><input %2$s />%3$s</span>',
            sanitize_html_class( $tag->name ), $atts, $validation_error );
        return $html;
    }
    

    my form is :

    <div class="custom-class">
    	<h2>contact form</h2>
    	<div class="row">
    		<div class="col-md-6 col-xs-12">
    			<div class="input-group">
                                    <label for="your-name">Name (text field) *</label>
    				[text* your-name id:your-name ]
    			</div>
    		</div>
                    <div class="col-md-6 col-xs-12">
    			<div class="input-group">
                                    <label for="text-homeaddress">Address (text-field)</label>
    				[text text-homeaddress id:text-homeaddress]
    			</div>
    		</div>
                    <div class="col-md-6 col-xs-12">
    			<div class="input-group">
                                    <label for="text-customphone">Custom phone number (custom text-field) (+XXYYYYYYYYY)</label>
    				[customphone* text-customphone id:text-customphone]
    			</div>
    		</div>
    		<div class="col-md-12 col-xs-12 ">
    			<div class="input-group text-center">
    
    				<button type="submit" class="contact-submit vc_general vc_btn3 vc_btn3-size-md vc_btn3-style-flat vc_btn3-color-theme_style_1">SEND</button>
    			</div>
    		</div>
    	</div>
    </div>

    best,

    • This reply was modified 2 years ago by dzamanakos.
    Plugin Author Takayuki Miyoshi

    (@takayukister)

    Try adding data-name="text-customphone" to the wrapper (wpcf7-form-control-wrap) element.

    Thread Starter dzamanakos

    (@dzamanakos)

    Thank you for your reply, it’s working now.

    best,

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Problem in custom tag validation’ is closed to new replies.