クライアントスクリプトの使用方法について説明します。タグの詳細については、“UJIタグリファレンス”を参照してください。
INPUTタグ、FORMタグをWebcoordinatorのタグに置換する。
クライアントスクリプトの記述対象とするINPUTタグ、およびそれを含むFORMタグを、uji:inputタグ、uji:formタグに置換します。 INPUTタグ内でvalueをuji:getPropertyタグを利用して設定している場合は、以下のように書き換えます。
<INPUT name="someinput" value="<uji:getProperty name='body' property='prop' />" > ↓ <uji:input name="someinput" bean="body" property="prop" ></uji:input>
ポイント
uji:getPropertyに限らず、拡張タグのアトリビュートには拡張タグ、JSPタグを記述することはできません。
uji:formタグには、フォームの名前を設定する必要があります。
<FORM method="post"> .... </FORM> ↓ <uji:form method="post" name="someform"> .... </uji:form>
uji:validateまたはuji:actionタグを記述する。
uji:inputタグの内容として、uji:validateまたはuji:actionタグを記述します。 uji:validateタグは予め準備された数種のチェック機能を備えています。 uji:actionタグはチェック内容を自由に記述します。これらのチェックは1つの項目に複数記述することが可能です。
<uji:input name="someinput">
<uji:validate event="blur" type="int" minInclusive="10" maxInclusive="20" >
window.status="入力項目には10～20の整数を指定せよ";
target.focus();
</uji:validate>
<uji:action event="..submit">
if(target.value == 15) {
window.status="この場合15は指定できない";
target.focus();
return false;
}
</uji:action>
</uji:input>eventアトリビュートには、チェックの契機を指定します。HTML組み込みイベントをカンマで区切って指定します。なお、submitとresetはフォームのイベントのため、"..submit"、"..reset"のように指定します。よく使うイベントには以下のものがあります。
イベント名 | 意味 |
|---|---|
blur | INPUT項目がフォーカスを失った |
submit | フォームの送信ボタンが押された |
reset | フォームのリセットボタンが押された |
エラー処理のJavaScriptを記述する。
uji:validateタグ、uji:actionタグの中では、inputのオブジェクトをtargetという変数名で参照できます。これを利用してJavaScriptを記述します。
ポイント
uji:validateタグのlength、minLength、maxLengthアトリビュートを使うことで、入力された文字数のチェックが可能です。補助文字の数え方は初期化パラメタuji.taglib.awareOfSupplementaryCharで設定できます。詳細は“13.3 初期化パラメタ”を参照してください。