Form
入力フィールドや送信ボタン等を含む入力フォーム(<form method='POST'>)を提供します。
テンプレートでは以下のようにして自動レイアウトされた入力フォームを出力することができます。
データバインディング
フォームとオブジェクトのバインディングのために以下のメソッドが用意されています。
- value object -> form fields copyFrom(Object)
- form fields -> value object copyTo(Object)
ネストしたプロパティに関してはOGNLを使うことで使用可能です。以下にバインディングの例を示します。
フォームのバリデーション
フォームは入力フィールドのバリデーションをサポートしています。バリデーションを無効にするにはsetValidate(boolean)をfalseに設定しておきます。
また、JavaScriptを使用したクライアントサイド・バリデーションもサポートしています。デフォルトでは無効になっていますが、有効にする場合は以下のようにsetJavaScriptValidation(boolean)にtrueを設定します。
HTMLインポート
FormコントロールはCSS (control.css) やJavaScript (control.js) をアプリケーションディレクトリ/clickというディレクトリに自動的に展開します。これらをHTMLテンプレートでインポートするにはPageImportsオブジェクトを使用します。
フォームのレイアウト
フォームのレイアウトは自動、手動の両方で行うことができます。
自動レイアウト
以下のようなオプションで自動レイアウトをカスタマイズすることができます。
オプション | 説明 |
---|---|
buttonAlign | ボタンの整列: ["left", "center", "right"] |
buttonStyle | ボタンの <td> タグの "style" 属性の値 |
columns | テーブルのカラム数。デフォルトは1 |
errorsAlign | バリデーションエラーメッセージの整列: ["left", "center", "right"] |
errorsPosition | バリデーションエラーメッセージの位置 ["top", "middle", "bottom"] |
errorsStyle | エラーの <td> タグの "style" 属性の値 |
fieldStyle | フィールドの <td> タグの "style" 属性の値 |
labelAlign | フィールドラベルの整列: ["left", "center", "right"] |
labelsPosition | フィールドラベルの位置: ["left", "top"] |
labelStyle | ラベルの <td> タグの "style" 属性の値 |
click/control.css | CSSスタイルを定義。clickディレクトリに自動的に展開される |
/click-control.properties | フォーム、フィールドのHTMLおよびメッセージ。クラスパスに配置されます |
手動レイアウト
手動でレイアウトを行う場合、テンプレートでは以下のようにしてフォームに格納されているフィールドにアクセスすることができます。
手動でレイアウトを行う場合は以下の項目を指定する必要があります。
- method - フォームの送信方法 ("POST"または"GET")。
- name - フォーム名。JavaScriptを使用する場合は重要になります。
- action - フォームの送信先ページ。
- form_name - Formコントロールに設定した名前。
手動レイアウトを行うテンプレートの例を以下に示します。
Velocityマクロ
Velocityマクロはフォームの自動レイアウトをカスタマイズするための良い方法です。
FormのfieldList、buttonListといったプロパティをVelocityマクロで使用することで、共通的なレイアウトを行うマクロを作成することができます。以下はwriteForm()という自動レイアウトを行うマクロの例です。このマクロはmacro.vmなどといったマクロファイルに含まれているものとします。
ページテンプレートでは以下のようにしてこのマクロを使用します。
マクロの設定
- 自作のマクロはWebアプリケーションのルートディレクトリにmacro.vmというファイル名で配置します。
- click/VM_global_macro.vmに自動展開されるファイルにマクロを記述しておくこともできます。macro.vmが存在すればそちらが優先されます。
- もし独自のファイル名でマクロを作成した場合はWEB-INF/velocity.propertiesのvelocimacro.libraryというプロパティに参照を追加します。Velocityのプロパティに関する詳細はここを参照してください。
不正なポストの防止
ページの更新や戻るボタンなどでフォームの二重送信が行われてしまう場合があります。これを防ぐにはポスト-リダイレクトパターンを使用します。このパターンはフォームがポストされたときに別のページへリダイレクトで遷移するというものです。ユーザがページを更新しても現在のページへのGETリクエストが発生するだけです。このトピックに関する詳細はRedirect After Postを参照してください。
戻るボタン対策にはFormのonSubmitCheck(Page, String)メソッドを使用します。
このメソッドはフォームが二重送信されないようセッションとhiddenフィールドに特別なトークンをストアします。