WordPressの大変便利なフォームプラグインの「MW WP Form」。
先日、「日付ピッカー」の不具合（というか仕様？）があり、対処した時のメモです。
日付ピッカーと謎の入力候補が重なる…
私はこのプラグインが大変好きでして、よく使っているのですが、先日、何気なく「日付ピッカー」を置き、動作チェックしていたところ…
日付ピッカーを表示させようと、入力フィールドをクリックしたところ、日付ピッカーの手前側に何やら謎の入力候補が…
「MW WP Form 日付ピッカー 不具合」などでググっても、同様の不具合報告はなく、ひとしきり検索して途方に暮れていたところ、ふと思い至ったのは、入力フィールドの「オートコンプリート」機能でした。
オートコンプリート機能をなんとかする
そう、入力フィールドをクリックして表示されていた候補は、フォームの入力候補を記憶して、入力を楽にしてくれる「オートコンプリート」機能によるものだったのです。
では、そのオートコンプリート機能をOFFにしてやればよろしい。やり方は、こんな感じ。
<input name="hoge" autocomplete = "off">
inputタグの中に「autocomplete = “off”」と書き込んでやれば、その入力フィールドに対して、オートコンプリート機能がOFFになるという事なのですが、今回の場合は、ちょっと厄介。
日付ピッカーのhtmlは、ショートコードで書き出しているので、直接htmlを書いて、対応する事は出来ません。
実際、下記のように書いてみました。
[mwform_datepicker name="候補1｜利用開始日" autocomplete="off" ]
が、実際に書き出されたhtmlを見てみると、見事にautocomplete属性の記述部分はカットされていました…
直接、MW WP Formプラグインをいじる！
ではどうするのか。とりあえず、MW WP Formプラグインをいじって、日付ピッカーのhtmlが書き出される時、自動的に「autocomplete=”off”」が入るように、手を入れました。（誰かに怒られそうですが…）
いじる対象ファイルは2つ。
mw-wp-form > classes > models > class.form.php
mw-wp-form > templates > form-fields > datepicker.php
■class.form.php
//修正前
public function datepicker( $name, $options = array() ) {
$defaults = array(
'id' => null,
'class' => null,
'size' => 30,
'js' => '',
'value' => '',
'placeholder' => null,
);
$options = shortcode_atts( $defaults, $options );
$options = array_merge( $options, array(
'name' => $name,
) );
return $this->remove_newline_space(
$this->_render( 'datepicker', $options )
);
}
//修正後
public function datepicker( $name, $options = array() ) {
$defaults = array(
'id' => null,
'class' => null,
'size' => 30,
'js' => '',
'value' => '',
'placeholder' => null,
'autocomplete' => 'off', //←ここ追加
);
$options = shortcode_atts( $defaults, $options );
$options = array_merge( $options, array(
'name' => $name,
) );
return $this->remove_newline_space(
$this->_render( 'datepicker', $options )
);
}
■datepicker.php
//修正前 <input type="text" name="<?php echo esc_attr( $name ); ?>" <?php echo MWF_Functions::generate_input_attribute( 'id', $id ); ?> <?php echo MWF_Functions::generate_input_attribute( 'class', $class ); ?> <?php echo MWF_Functions::generate_input_attribute( 'size', $size ); ?> <?php echo MWF_Functions::generate_input_attribute( 'value', $value ); ?> <?php echo MWF_Functions::generate_input_attribute( 'placeholder', $placeholder ); ?> />
//修正後 <input type="text" name="<?php echo esc_attr( $name ); ?>" <?php echo MWF_Functions::generate_input_attribute( 'id', $id ); ?> <?php echo MWF_Functions::generate_input_attribute( 'class', $class ); ?> <?php echo MWF_Functions::generate_input_attribute( 'size', $size ); ?> <?php echo MWF_Functions::generate_input_attribute( 'value', $value ); ?> <?php echo MWF_Functions::generate_input_attribute( 'placeholder', $placeholder ); ?> <?php echo MWF_Functions::generate_input_attribute( 'autocomplete', $autocomplete ); ?> //←ここ追加 />
変更して保存した後、ページの方で確認したところ「autocomplete=”off”」がちゃんと入っているのを確認。動作的にも候補が表示されないことが確認できてスッキリ！
今日はよく眠れそうです。
ありがとうございました。
