web-dev-qa-db-ja.com

WooCommerceチェックアウトフィールドのカスタム検証

電話番号を検証するための独自の正規表現を追加したいと思います。私のclass-wc-validation.php必要に応じて正規表現を変更しました。

public static function is_phone( $phone ) {
    //if ( strlen( trim( preg_replace( '/[\s\#0-9_\-\+\(\)]/', '', $phone ) ) ) > 0 )
    if ( strlen( trim( preg_replace( '/^[6789]\d{9}$/', '', $phone ) ) ) > 0 )
        return false;

    return true;
}

しかし、検証は行われていません。何が欠けていますか？

phpwordpressvalidationwoocommercecheckout
9
Philomath

これらをwoocommerceチェックアウトフローにフックするコードは見たことがありません。上のドキュメントを確認してください

woocommerce_checkout_processおよびwoocommerce_checkout_order_processed

しかし、あなたの場合は、woocommerce_checkout_processに接続することを強くお勧めします

以下のコードをテーマのfunctions.phpに配置するか、独自のwoocommerceプラグインを作成して、bootstrapコードに配置します。

add_action('woocommerce_checkout_process', 'is_phone');

function is_phone() { 
    $phone_number = $_POST['---your-phone-field-name---'];
    // your function's body above, and if error, call this wc_add_notice
    wc_add_notice( __( 'Your phone number is wrong.' ), 'error' );
}
14
r4ccoon

同じ問題に直面していて、他の人がここで言ったことに従っていたが、Woocommerceはwoocommerce_checkout_process 針。

しかし、最新のWoocommerce 3.0（これが2.xバージョンであるかどうかは不明）では、woocommerce_after_checkout_validationフックしてから$data param標準のチェックアウトフィールドを使用している場合、または$_POST標準のWoocommerceの方法で追加されていないカスタムフィールドがある場合。コードの例は次のとおりです。

public function validate($data,$errors) { 
    // Do your data processing here and in case of an 
    // error add it to the errors array like:
        $errors->add( 'validation', __( 'Please input that correctly.' ));
}
add_action('woocommerce_after_checkout_validation', 'validate',10,2);

お役に立てば幸いです。

11
sraman

プラグインファイルを編集しないでください。プラグインを更新すると、すべてのカスタマイズが失われ、フックを使用して目的を達成できるからです。 woocommerce_checkout_process フックを使用してこれを行うことができます。

これがコードです：

add_action('woocommerce_checkout_process', 'wh_phoneValidateCheckoutFields');

function wh_phoneValidateCheckoutFields() {
    $billing_phone = filter_input(INPUT_POST, 'billing_phone');

    if (strlen(trim(preg_replace('/^[6789]\d{9}$/', '', $billing_phone))) > 0) {
        wc_add_notice(__('Invalid <strong>Phone Number</strong>, please check your input.'), 'error');
    }
}

コードは、アクティブな子テーマ（またはテーマ）のfunctions.phpファイルに入ります。または、プラグインでもPHP files。

注：デフォルトでは、WooCommerceはbilling_phoneフィールドを使用して電話番号を取得しますが、それをカスタマイズしている場合は、billing_phoneをフィールド名に置き換えることができます。

お役に立てれば！

6
Raunak Gupta

あなたの質問では、検証ルールが機能していないと言っていますが、間違った方法で書かれていると思います。正規表現ツールを使用してオンラインでテストできます。 Regex101 またはその他。

このトピックに関するより一般的な答えとして、検証ルールを安全に変更するには、次のようにします。

class-wc-validation.phpをyour_theme_path/woocommerce/includes/class-wc-validation.phpのテーマディレクトリにコピーし、検証ルールをカスタマイズします。

次に、checkout.jsに登録されている電話の検証ルールを作成する必要があります。そうしないと、フィールドが無効であっても、フィールドに常に緑色の境界線が表示されます。

したがって、私の解決策は、192行目についてのカスタム正規表現バリデーターをcheckout.jsに追加することでした。

    if ( $parent.is( '.validate-phone' ) ) {
            if ( $this.val() ) {

                var pattern = new RegExp(/^([0-9\s\/\+\-\#\_\(\)]*)$/);

                if ( ! pattern.test( $this.val()  ) ) {
                    $parent.removeClass( 'woocommerce-validated' ).addClass( 'woocommerce-invalid woocommerce-invalid-phone' );
                    validated = false;
                }
            }
        }

カスタマイズした.jsファイルを含めます（functions.phpに）

add_action( 'wp_enqueue_scripts', 'my_checkoutjs_enqueue_scripts', 100 );

function gv_checkoutjs_enqueue_scripts() {

if ( is_checkout() ) {
    wp_deregister_script( 'wc-checkout' );
    wp_enqueue_script( 'wc-checkout', get_template_directory_uri() . '/js/modified_checkout.js', array( 'jquery', 'woocommerce', 'wc-country-select', 'wc-address-i18n' ) );
}}

お役に立てれば！

1
Arkady