Как добавить разделитель тысяч пробелами в input Contact Form 7 в Wordpress

Вывод поля "text" Contact Form 7 в Wordpress

<div class="contact-form-field">
        <span class="wpcf7-form-control-wrap text-152"><input type="text" name="text-152" value="" size="40" class="wpcf7-form-control wpcf7-text" aria-invalid="false"></span>
        </div>

Стандартный tag "text" не стал использовать т.к. в дальнейшем его использовать нельзя, потому что в это поле можно ввести только номер.


Ответы (1 шт):

Автор решения: ansh

Решил самостоятельно. Возможно кому то пригодится.

  1. Добавил script в function.php шаблона:

function FormatCurrency(ctrl) {
            //Check if arrow keys are pressed - we want to allow navigation around textbox using arrow keys
            if (event.keyCode == 37 || event.keyCode == 38 || event.keyCode == 39 || event.keyCode == 40) {
                return;
            }

            var val = ctrl.value;

            val = val.replace(/ /g, "")
            ctrl.value = "";
            val += '';
            x = val.split('.');
            x1 = x[0];
            x2 = x.length > 1 ? '.' + x[1] : '';

            var rgx = /(\d+)(\d{3})/;

            while (rgx.test(x1)) {
                x1 = x1.replace(rgx, '$1' + ' ' + '$2');
            }

            ctrl.value = x1 + x2;
        }

        function CheckNumeric() {
            return event.keyCode >= 48 && event.keyCode <= 57 || event.keyCode == 46;
        }
<input type="text" onkeypress="return CheckNumeric()" onkeyup="FormatCurrency(this)" />

  1. Добавил свой "tag" - "number2" Contact Form 7 в файле .../wp-content/plugins/contact-form-7/modules/text.php и onkeypress="return CheckNumeric()" onkeyup="FormatCurrency(this)" Добавлял все строки по аналогии с телефоном ('tel') и только для "number2" на 55 строке добавил:

    if ( in_array( $tag->basetype, array( 'number2' ) ) ) {
      $atts['onkeypress'] = $tag->get_size_option( 'return CheckNumeric()' );
            $atts['onkeyup'] = $tag->get_size_option( 'FormatCurrency(this)' );
  }

Ниже весь файл .../wp-content/plugins/contact-form-7/modules/text.php

<?php
/**
** A base module for the following types of tags:
**  [text] and [text*]      # Single-line text
**  [email] and [email*]    # Email address
**  [url] and [url*]        # URL
**  [tel] and [tel*]        # Telephone number
**/

/* form_tag handler */

add_action( 'wpcf7_init', 'wpcf7_add_form_tag_text', 10, 0 );

function wpcf7_add_form_tag_text() {
    wpcf7_add_form_tag(
        array( 'text', 'text*', 'email', 'email*', 'url', 'url*', 'tel', 'tel*', 'number2', 'number2*' ),
        'wpcf7_text_form_tag_handler',
        array(
            'name-attr' => true,
        )
    );
}

function wpcf7_text_form_tag_handler( $tag ) {
    if ( empty( $tag->name ) ) {
        return '';
    }

    $validation_error = wpcf7_get_validation_error( $tag->name );

    $class = wpcf7_form_controls_class( $tag->type, 'wpcf7-text' );

    if ( in_array( $tag->basetype, array( 'email', 'url', 'tel', 'number2' ) ) ) {
        $class .= ' wpcf7-validates-as-' . $tag->basetype;
    }

    if ( $validation_error ) {
        $class .= ' wpcf7-not-valid';
    }

    $atts = array();

    $atts['size'] = $tag->get_size_option( '40' );
    $atts['maxlength'] = $tag->get_maxlength_option();
    $atts['minlength'] = $tag->get_minlength_option();

    if ( $atts['maxlength'] and $atts['minlength']
    and $atts['maxlength'] < $atts['minlength'] ) {
        unset( $atts['maxlength'], $atts['minlength'] );
    }

    $atts['class'] = $tag->get_class_option( $class );
    $atts['id'] = $tag->get_id_option();
    $atts['tabindex'] = $tag->get_option( 'tabindex', 'signed_int', true );
    if ( in_array( $tag->basetype, array( 'number2' ) ) ) {
            $atts['onkeypress'] = $tag->get_size_option( 'return CheckNumeric()' );
            $atts['onkeyup'] = $tag->get_size_option( 'FormatCurrency(this)' );
    }

    $atts['autocomplete'] = $tag->get_option( 'autocomplete',
        '[-0-9a-zA-Z]+', true );

    if ( $tag->has_option( 'readonly' ) ) {
        $atts['readonly'] = 'readonly';
    }

    if ( $tag->is_required() ) {
        $atts['aria-required'] = 'true';
    }

    if ( $validation_error ) {
        $atts['aria-invalid'] = 'true';
        $atts['aria-describedby'] = wpcf7_get_validation_error_reference(
            $tag->name
        );
    } else {
        $atts['aria-invalid'] = 'false';
    }

    $value = (string) reset( $tag->values );

    if ( $tag->has_option( 'placeholder' )
    or $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;
}


/* Validation filter */

add_filter( 'wpcf7_validate_text', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_text*', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_email', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_email*', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_url', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_url*', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_tel', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_tel*', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_number2', 'wpcf7_text_validation_filter', 10, 2 );
add_filter( 'wpcf7_validate_number2*', 'wpcf7_text_validation_filter', 10, 2 );

function wpcf7_text_validation_filter( $result, $tag ) {
    $name = $tag->name;

    $value = isset( $_POST[$name] )
        ? trim( wp_unslash( strtr( (string) $_POST[$name], "\n", " " ) ) )
        : '';

    if ( 'text' == $tag->basetype ) {
        if ( $tag->is_required() and '' === $value ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_required' ) );
        }
    }

    if ( 'email' == $tag->basetype ) {
        if ( $tag->is_required() and '' === $value ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_required' ) );
        } elseif ( '' !== $value and ! wpcf7_is_email( $value ) ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_email' ) );
        }
    }

    if ( 'url' == $tag->basetype ) {
        if ( $tag->is_required() and '' === $value ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_required' ) );
        } elseif ( '' !== $value and ! wpcf7_is_url( $value ) ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_url' ) );
        }
    }

    if ( 'tel' == $tag->basetype ) {
        if ( $tag->is_required() and '' === $value ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_required' ) );
        } elseif ( '' !== $value and ! wpcf7_is_tel( $value ) ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_tel' ) );
        }
    }
    if ( 'number2' == $tag->basetype ) {
        if ( $tag->is_required() and '' === $value ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_required' ) );
        } elseif ( '' !== $value and ! wpcf7_is_tel( $value ) ) {
            $result->invalidate( $tag, wpcf7_get_message( 'invalid_number2' ) );
        }
    }

    if ( '' !== $value ) {
        $maxlength = $tag->get_maxlength_option();
        $minlength = $tag->get_minlength_option();

        if ( $maxlength and $minlength and $maxlength < $minlength ) {
            $maxlength = $minlength = null;
        }

        $code_units = wpcf7_count_code_units( stripslashes( $value ) );

        if ( false !== $code_units ) {
            if ( $maxlength and $maxlength < $code_units ) {
                $result->invalidate( $tag, wpcf7_get_message( 'invalid_too_long' ) );
            } elseif ( $minlength and $code_units < $minlength ) {
                $result->invalidate( $tag, wpcf7_get_message( 'invalid_too_short' ) );
            }
        }
    }

    return $result;
}


/* Messages */

add_filter( 'wpcf7_messages', 'wpcf7_text_messages', 10, 1 );

function wpcf7_text_messages( $messages ) {
    $messages = array_merge( $messages, array(
        'invalid_email' => array(
            'description' =>
                __( "Email address that the sender entered is invalid", 'contact-form-7' ),
            'default' =>
                __( "The e-mail address entered is invalid.", 'contact-form-7' ),
        ),

        'invalid_url' => array(
            'description' =>
                __( "URL that the sender entered is invalid", 'contact-form-7' ),
            'default' =>
                __( "The URL is invalid.", 'contact-form-7' ),
        ),

        'invalid_tel' => array(
            'description' =>
                __( "Telephone number that the sender entered is invalid", 'contact-form-7' ),
            'default' =>
                __( "The telephone number is invalid.", 'contact-form-7' ),
        ),
        'invalid_number2' => array(
            'description' =>
                __( "Number that the sender entered is invalid", 'contact-form-7' ),
            'default' =>
                __( "The number is invalid.", 'contact-form-7' ),
        ),
    ) );

    return $messages;
}


/* Tag generator */

add_action( 'wpcf7_admin_init', 'wpcf7_add_tag_generator_text', 15, 0 );

function wpcf7_add_tag_generator_text() {
    $tag_generator = WPCF7_TagGenerator::get_instance();
    $tag_generator->add( 'text', __( 'text', 'contact-form-7' ),
        'wpcf7_tag_generator_text' );
    $tag_generator->add( 'email', __( 'email', 'contact-form-7' ),
        'wpcf7_tag_generator_text' );
    $tag_generator->add( 'url', __( 'URL', 'contact-form-7' ),
        'wpcf7_tag_generator_text' );
    $tag_generator->add( 'tel', __( 'tel', 'contact-form-7' ),
        'wpcf7_tag_generator_text' );
    $tag_generator->add( 'number2', __( 'number2', 'contact-form-7' ),
        'wpcf7_tag_generator_text' );
}

function wpcf7_tag_generator_text( $contact_form, $args = '' ) {
    $args = wp_parse_args( $args, array() );
    $type = $args['id'];

    if ( ! in_array( $type, array( 'email', 'url', 'tel', 'number2' ) ) ) {
        $type = 'text';
    }

    if ( 'text' == $type ) {
        $description = __( "Generate a form-tag for a single-line plain text input field. For more details, see %s.", 'contact-form-7' );
    } elseif ( 'email' == $type ) {
        $description = __( "Generate a form-tag for a single-line email address input field. For more details, see %s.", 'contact-form-7' );
    } elseif ( 'url' == $type ) {
        $description = __( "Generate a form-tag for a single-line URL input field. For more details, see %s.", 'contact-form-7' );
    } elseif ( 'tel' == $type ) {
        $description = __( "Generate a form-tag for a single-line telephone number input field. For more details, see %s.", 'contact-form-7' );
    } elseif ( 'number2' == $type ) {
        $description = __( "Generate a form-tag for a single-line number input field. For more details, see %s.", 'contact-form-7' );
    }

    $desc_link = wpcf7_link( __( 'https://contactform7.com/text-fields/', 'contact-form-7' ), __( 'Text fields', 'contact-form-7' ) );

?>
<div class="control-box">
<fieldset>
<legend><?php echo sprintf( esc_html( $description ), $desc_link ); ?></legend>

<table class="form-table">
<tbody>
    <tr>
    <th scope="row"><?php echo esc_html( __( 'Field type', 'contact-form-7' ) ); ?></th>
    <td>
        <fieldset>
        <legend class="screen-reader-text"><?php echo esc_html( __( 'Field type', 'contact-form-7' ) ); ?></legend>
        <label><input type="checkbox" name="required" /> <?php echo esc_html( __( 'Required field', 'contact-form-7' ) ); ?></label>
        </fieldset>
    </td>
    </tr>

    <tr>
    <th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-name' ); ?>"><?php echo esc_html( __( 'Name', 'contact-form-7' ) ); ?></label></th>
    <td><input type="text" name="name" class="tg-name oneline" id="<?php echo esc_attr( $args['content'] . '-name' ); ?>" /></td>
    </tr>

    <tr>
    <th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-values' ); ?>"><?php echo esc_html( __( 'Default value', 'contact-form-7' ) ); ?></label></th>
    <td><input type="text" name="values" class="oneline" id="<?php echo esc_attr( $args['content'] . '-values' ); ?>" /><br />
    <label><input type="checkbox" name="placeholder" class="option" /> <?php echo esc_html( __( 'Use this text as the placeholder of the field', 'contact-form-7' ) ); ?></label></td>
    </tr>

<?php if ( in_array( $type, array( 'text', 'email', 'url', 'number2' ) ) ) : ?>
    <tr>
    <th scope="row"><?php echo esc_html( __( 'Akismet', 'contact-form-7' ) ); ?></th>
    <td>
        <fieldset>
        <legend class="screen-reader-text"><?php echo esc_html( __( 'Akismet', 'contact-form-7' ) ); ?></legend>

<?php if ( 'text' == $type ) : ?>
        <label>
            <input type="checkbox" name="akismet:author" class="option" />
            <?php echo esc_html( __( "This field requires author's name", 'contact-form-7' ) ); ?>
        </label>
<?php elseif ( 'email' == $type ) : ?>
        <label>
            <input type="checkbox" name="akismet:author_email" class="option" />
            <?php echo esc_html( __( "This field requires author's email address", 'contact-form-7' ) ); ?>
        </label>
<?php elseif ( 'url' == $type ) : ?>
        <label>
            <input type="checkbox" name="akismet:author_url" class="option" />
            <?php echo esc_html( __( "This field requires author's URL", 'contact-form-7' ) ); ?>
        </label>
<?php endif; ?>

        </fieldset>
    </td>
    </tr>
<?php endif; ?>

    <tr>
    <th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-id' ); ?>"><?php echo esc_html( __( 'Id attribute', 'contact-form-7' ) ); ?></label></th>
    <td><input type="text" name="id" class="idvalue oneline option" id="<?php echo esc_attr( $args['content'] . '-id' ); ?>" /></td>
    </tr>

    <tr>
    <th scope="row"><label for="<?php echo esc_attr( $args['content'] . '-class' ); ?>"><?php echo esc_html( __( 'Class attribute', 'contact-form-7' ) ); ?></label></th>
    <td><input type="text" name="class" class="classvalue oneline option" id="<?php echo esc_attr( $args['content'] . '-class' ); ?>" /></td>
    </tr>

</tbody>
</table>
</fieldset>
</div>

<div class="insert-box">
    <input type="text" name="<?php echo $type; ?>" class="tag code" readonly="readonly" onfocus="this.select()" />

    <div class="submitbox">
    <input type="button" class="button button-primary insert-tag" value="<?php echo esc_attr( __( 'Insert Tag', 'contact-form-7' ) ); ?>" />
    </div>

    <br class="clear" />

    <p class="description mail-tag"><label for="<?php echo esc_attr( $args['content'] . '-mailtag' ); ?>"><?php echo sprintf( esc_html( __( "To use the value input through this field in a mail field, you need to insert the corresponding mail-tag (%s) into the field on the Mail tab.", 'contact-form-7' ) ), '<strong><span class="mail-tag"></span></strong>' ); ?><input type="text" class="mail-tag code hidden" readonly="readonly" id="<?php echo esc_attr( $args['content'] . '-mailtag' ); ?>" /></label></p>
</div>
<?php
}

→ Ссылка