WordPressのプラグイン「MW WP Form」セレクトメニューの最初に「選択してください」などの文字を設定する方法を紹介します。
MW WP Form とは、ショートコードを使って確認画面付きのメールフォームを作成することができるプラグインです。
jQuery(JavaScript)で設定する方法
管理画面からセレクトボックスを配置する場合
[mwform_select name="お問い合わせ内容" children=",お問い合わせ,お見積り,その他"]
childrenの最初に「,」を入れます。 これでvalueに空の項目が追加されます。
このままだと「選択してください」の表示がされないので、MW WP Form設定画面の一番最初に下記のスクリプトを追加します。
<script type="text/javascript"> jQuery( function( $ ) { $( '#mw_wp_form_mw-wp-form-123 select option[value=""]' ) .html( '選択してください。' ); } ); </script>
#mw_wp_form_mw-wp-form-123 → //123の数字部分を作成中のフォーム識別子に変更します。
これで「選択してください」が表示されるようになります。
jQuery(JavaScript)なしで設定する方法
jQueryなしで初期値ありの必須項目が設定されたselectを設置したい場合は、post_rawという送信値と表示値を分割するオプションを使って設定することができます。
[mwform_select name="お問い合わせ内容" children=":選択してください,お問い合わせ,お見積り,その他" post_raw="true"]
このように children の最初に “ :選択してください, ” を入れ、ショートコードの記述内に “ post_raw=”true” ” を追加します。このselect要素に対して必須項目のバリデーション設定を行ってあげれば、jQueryを使って設定していた初期値ありで必須項目に設定するという動きをjQueryなしで設定することができます。