ラジオボタン/セレクトの追加
メールフォームプラグインで、メールフォームにラジオボタン(<input type="radio"...>)またはセレクト(<select...>~</select>)を追加する方法を解説します。
GetQueryParamプラグインのインストール
ラジオボタンやセレクトを使う場合、「GetQueryParam」というプラグインが必要になります。
2024年2月1日以降にご購入いただいた場合は、MailFormプラグインに同梱されています。
それ以前にご購入いただいている場合にはテクニカルサポートまでお問い合わせください。
ダウンロードしたファイルを解凍すると、「GetQueryParam」フォルダができます。
このフォルダを、Movable Typeの「plugins」ディレクトリにアップロードします。
なお、旧版のメールフォームプラグインでもGetQueryParamプラグインを組み合わせていましたが、その時のプラグインよりバージョンアップしています(旧バージョンは1.11)。
旧バージョンを使っていた方は、新バージョンに差し替えてください。
送信値/表示値/IDのリストの作成
フォームにラジオボタンやセレクトを入れるには、それぞれの選択肢に対応するタグに、「送信」ボタンがクリックされたときにCGIに送信する値(以後「送信値」と略)と、フォームに表示する値(以後「表示値」と略)を指定することが必要です。
ラジオボタン
<input type="radio" name="フィールド名" id="フィールドのID" value="送信値" />表示値
セレクト(のoptionタグ)
<option value="送信値">表示値</option>
メールフォームにラジオボタンやセレクトを入れるには、まず送信値と表示値のリストを作ることから始めます。
このリストは、GetQueryParamプラグインの「MTSetParamList」というコンテナタグで作成します。
以下のように、このタグのコンテナの中に、送信値と表示値を「|」で区切ったものを書きます。
また、「list_name」というアトリビュートで、リストの名前も指定します。
なお、送信値と表示値は同じ値にしても構いません。
<MTSetParamList list_name="リスト名">
送信値1|表示値1
送信値2|表示値2
...
送信値n|表示値n
</MTSetParamList>
さらに、ラジオボタンではそれぞれにIDを振ることもできます。
その場合は、以下のようにして、送信値/表示値/IDを「|」で区切ってリストを作ります。
<MTSetParamList list_name="リスト名">
送信値1|表示値1|ID1
送信値2|表示値2|ID2
...
送信値n|表示値n|IDn
</MTSetParamList>
なお、このタグは、「メールフォーム共通部分」のテンプレートに入れます。
input/selectタグの出力
上記の手順で送信値と表示値のリストを作成しましたが、そのリストを利用して、inputやselectのタグを出力します。
リストから送信値と表示値を取り出すには、GetQueryParamプラグインの「MTGetParamList」というコンテナタグを使います。
「list_name="リスト名"」のアトリビュートを指定して、値を取り出すリストを指定します。
また、送信値/表示値/IDは、それぞれ以下のタグで出力することができます。
出力したい値 | タグ |
送信値 | <MTVar name="gp_value"> |
表示値 | <MTVar name="gp_string"> |
ID | <MTVar name="gp_id"> |
MTGetParamListタグ等を使って、ラジオボタンやセレクトを出力するには、以下のようにタグを組み合わせます。
・ラジオボタン
<MTGetParamList list_name="リスト名">
<input type="radio" name="フィールド名" id="<MTVar name="gp_id">" value="<MTVar name="gp_value">"<MTIf name="フィールド名" eq="$gp_value"> checked="checked"</MTIf> /><MTVar name="gp_string">
</MTGetParamList>
・セレクト
<select name="フィールド名">
<MTGetParamList list_name="リスト名"> <option value="<MTVar name="gp_value">"<MTIf name="フィールド名" eq="$gp_value"> selected="selected"</MTIf>><MTVar name="gp_string"></option> </MTGetParamList>
</select>
初期値の設定
セレクト/ラジオボタンを表示する際に、選択肢の1つを選択した状態にしておくこともできます。
それには、「メールフォーム」のテンプレートに、以下のようなタグを入れます。
<MTSetVar name="フィールド名" value="選択する項目の送信値">
例
例えば、「赤」「青」「緑」の色を選べるようにしたいとします。
そのフィールド名を「mail_color」にし、また色のリストには「list_color」という名前をつけるとします。
セレクトで選択できるようにする場合、「メールフォーム共通部分」のテンプレートに、以下のようなタグを入れます。
<MTSetParamList list_name="list_color">
赤|赤
青|青
緑|緑 </MTSetParamList>
<p>色<br />
<select name="mail_color" id="mail_color">
<MTGetParamList list_name="list_color">
<option value="<MTVar name="gp_value">"<MTIf name="mail_color" eq="$gp_value">
selected="selected"</MTIf>><MTVar name="gp_string"></option>
</MTGetParamList>
</select>
</p>
一方、ラジオボタンで選択できるようにしたいとします。
また、各ラジオボタンには「mail_color_red」「mail_color_blue」mail_color_green」のIDを割り当てたいとします。
この場合は、以下のようなタグを入れます。
<MTSetParamList list_name="list_color">
赤|赤|mail_color_red
青|青|mail_color_blue
緑|緑|mail_color_green
</MTSetParamList>
<p>色<br />
<MTGetParamList list_name="list_color">
lt;input type="radio" name="mail_color" id="<MTVar name="gp_id">" value="<MTVar name="gp_value">"<MTIf name="mail_color" eq="$gp_value"> checked="checked"</MTIf>><MTVar name="gp_string">
</MTGetParamList>
</select>
</p>
また、上記のセレクト/ラジオボタンで、「赤」を初期値にしたいとします。
この場合、「メールフォーム」のテンプレートに以下のタグを入れます。
<MTSetVar name="mail_color" value="赤">