ドロップダウン/ラジオボタンのカスタムフィールドの検索
検索フォームを使ってカスタムフィールドの値を検索する際に、ドロップダウンまたはラジオボタンのカスタムフィールドを検索対象にしたいこともあります。
その場合、ドロップダウン/ラジオボタンの選択肢を、検索フォームに出力することが必要になります。
今日はその方法を解説します。
以下のような事例を基に解説します。
- 都道府県の情報を、「pref」というベースネームのドロップダウンのカスタムフィールドに保存しています。
- ドロップダウンのカスタムフィールドの選択肢を読み込んで、それらを検索フォームに表示します。
- 検索結果表示用のテンプレートモジュールには、「詳細検索結果」という名前を付けるものとします。
検索フォームの作成
まず、検索フォームを作成します。
ドロップダウン(またはラジオボタン)の選択肢を読み込むことが、検索フォーム作成のポイントです。
1.SupplementalCFTagsプラグイン
Movable Typeの標準のテンプレートタグでは、ドロップダウン(ラジオボタン)のカスタムフィールドの選択肢だけを読み込むタグがありません。
そこで、「SupplementalCFTags」プラグインを利用して、選択肢を読み込むようにします。
SupplementalCFTagsプラグインは、以下からダウンロードすることができます。
ダウンロードしたファイルを解凍すると、「plugins」というフォルダができます。
このフォルダを、Movable Typeのインストール先ディレクトリにアップロードします。
2.MTLoadCustomFieldInfoタグ/MTCustomFieldOptionsタグ/MTCustomFieldOptionValueタグ
SupplementalCFTagsプラグインを使うと、ドロップダウン(ラジオボタン)の選択肢を、MTLoadCustomFieldInfoタグ/MTCustomFieldOptionsタグの2つのテンプレートタグで順に読み込めるようになります。
また、個々の選択肢の値は、「MTCustomFieldOptionValue」というテンプレートタグで出力します。
タグの書き方は以下の通りです。
「ベースネーム」の部分には、カスタムフィールドのベースネームを指定します。
<mt:LoadCustomFieldInfo basename="ベースネーム">
<mt:CustomFieldOptions>
個々の選択肢を出力する処理(MTCustomFieldOptionValueタグを使用)
</mt:CustomFieldOptions>
</mt:LoadCustomFieldInfo>
3.検索フォームの作成
ここまでの話に基づいて、検索フォームを作ります。
最初に述べたように、ドロップダウンに「pref」というベースネームを付けているとします。
検索フォームにselect要素を表示し、このドロップダウンの選択肢を選べるようにするには、以下のように検索フォームを組みます。
<form method="get" action="<$mt:RealtimeRebuildCGIPath$>">
<input type="hidden" name="blog_id" value="<$mt:BlogID$>" />
<input type="hidden" name="tmpl_id" value="<$mt:GetTemplateID tmpl_name="ドロップダウン検索結果"$>" />
<p>
<label for="pref">都道府県</label>
<select name="pref" id="pref">
<mt:LoadCustomFieldInfo basename="pref">
<mt:CustomFieldOptions>
<option value="<$mt:CustomFieldOptionValue$>"><$mt:CustomFieldOptionValue$></option>
</mt:CustomFieldOptions>
</mt:LoadCustomFieldInfo>
</select>
</p>
<p>
<input type="submit" value="送信" />
</p>
</form>
7~11行目の部分で、ベースネームが「pref」のドロップダウンから選択肢を読み込み、select内のoption要素に順次出力しています。
検索結果テンプレートの作り方
次に、検索結果テンプレートを作ります。
検索フォームからは、選択肢の文字列が送信されてきます。
その値を、MTSearchConditionCFValuesタグで条件に指定すれば、検索を行うことができます。
「検索フォームの作成」の手順で作ったフォームだと、selectのname属性が「pref」です。
したがって、MTGetQueryParamsToVarsタグによって、選択された値は変数qp_prefに代入されます。
この値を、MTSearchConditionCFValuesタグで条件に指定します。
ここまでの話に沿って、検索結果テンプレートの主要部分を組むと、以下のようになります。
3/5行目のMTSearchConditionCFSectionタグで、ベースネームが「pref」のカスタムフィールドを検索対象にしています。
そして、4行目のMTSearchConditionCFValuesタグで、フォームで選択された値を検索の条件にしています。
<$mt:GetQueryParamsToVars$>
<mt:SearchConditions>
<mt:SearchConditionCFSection field="pref">
<$mt:SearchConditionCFValues values="$qp_pref"$>
</mt:SearchConditionCFSection>
</mt:SearchConditions>
<mt:IfNonZero tag="SearchLoadedEntryCount">
<p><$mt:SearchLoadedEntryCount$>件</p>
<mt:Entries>
<$mt:Include module="ブログ記事の概要"$>
</mt:Entries>
<mt:Else>
<p>条件に合う記事がありませんでした。</p>
</mt:IfNonZero>