フォームの$タグについて~種類と機能~

スパイラル®でフォームをHTMLで編集する際に入力欄のvalue値等にデフォルトで記載されいてる$タグがあります。
$タグを理解し、活用することで様々な仕様に柔軟に対応することが可能です。
今回は$タグについて解説します。

こちらも併せてご確認ください。
スパイラル®フォームのHTMLソース編集と注意点


1. $hoge$とは

$hoge$は入力された値を引継ぐためのタグです。
主に入力画面のテキストフィールドや確認画面で使われます。
これが入っていることで入力でエラーが発生した際に入力画面での入力情報をエラー画面に引き継ぐことができます。
また、確認画面や入力完了画面で入力された情報を表示できるようになっています。
下は$タグありとなしの挙動とHTMLソースです。$タグなしの場合は入力された値が引き継がれません。

テキストフィールドの画像01
HTMLソースの画像01

2. $hoge:***$とは

アスタリスク(***)部分にはフィールドタイプによって様々な値が入ります。

主に入力項目に対する値の引継ぎ用として利用されます。
例えばプルダウンやラジオボタン、チェックボックスなどの入力項目ですとエラー時に$hoge$で選択した値を戻してもHTML上では意味をなさないため、$hoge:***$とすることでcheckdやselectedを$hoge:***$が入っている部分に挿入することができます。
下は$hoge:***$形式と$hoge$形式、$タグなしの挙動とHTMLソースです。$hoge$形式の場合はプルダウンで有効な形式(selected)で出力されないため、フォーム上に反映されません。

テキストフィールドの画像02
HTMLソースの画像02
HTMLソースの画像03

コロン( : )の後にどのような値を付けられるかは差替えキーワード($ タグ)一覧で確認できます。
差し替えキーワード一覧のリンクはこちら

3. $error:hoge$とは

管理画面で設定したエラーメッセージを表示するためのタグです。
$error:hoge$部分にDBの差し替えキーワードhogeの項目のエラーメッセージが出力されます。
デフォルトでは、項目の下部に一つのみ記載されています。
要件によって場所を移動したり、2つ3つ設置することも可能です。
下の図は$error:hoge$がある場合、ない場合のフォーム上の挙動とHTMLです。

テキストフィールドの画像03
HTMLソースの画像04