2.1.46. カレンダー日付入力ウィジェット

カレンダー日付入力ウィジェットはUI標準 UI部品 カレンダー日付入力 の内容に準拠したカレンダーを使用した日付入力欄を出力する。

2.1.46.1. コードサンプル

設計成果物(ローカル動作)

<field:calendar
    title="日付"
    name="date1"
    required="true"
    hint="(入力例 ： 2012/05/12)"
    sample="2013/09/30">
</field:calendar>

実装成果物(サーバ動作)

<field:calendar
    title="日付"
    name="W99ZZ64.date1"
    required="true"
    hint="(入力例 ： 2012/05/12)"
    sample="2013/09/30">
</field:calendar>

2.1.46.2. 仕様

このウィジェットは入力項目ウィジェット共通テンプレートを用いて実装している。入力項目ウィジェット共通テンプレートが実装する共通仕様についてはここでは記述しない。

ローカル動作時の挙動

入力画面ではsampleに指定した値を初期表示値としてテキストボックスに表示する。

確認画面ではsampleに指定した値を、ラベルとして表示する。

属性値一覧 [◎ 必須属性 ○ 任意属性 × 無効(指定しても効果なし)]

名称 内容 タイプ サーバ ローカル 備考
id htmlのid属性 文字列 ○ ○ 省略時は name 属性と同じ値。
(ローカル動作においても**id** 属性か name 属性のいずれかは必須。)
domain 項目のドメイン型 文字列 ○ ○  
readonly 編集可能かどうか 真偽値 ○ ○ デフォルトは ‘false’
disabled サーバに対する入力値の送信を 抑制するかどうか 真偽値 ○ ○ デフォルトは ‘false’
example 具体的な入力例を表すテキスト (placeholderなどの 形式で表示する) 文字列 ○ ○  
cssClass HTMLのclass属性値 文字列 ○ ○  
nameAlias 一つのエラーメッセージに 対して複数の入力項目を ハイライト表示する場合に 指定する。 文字列 ○ ×  
format 日付のフォーマット 文字列 ○ ○ デフォルトは ‘yyyy/MM/dd’
locale 言語設定 文字列 ○ ○ デフォルトは ‘ja’
sample ローカル動作時に表示する日付 文字列 × ○  
maxlength 入力文字数の上限 数値 ○ ○ format が未指定の場合は “10”
dataFrom 表示するデータの取得元 文字列 × × 画面項目定義に記載する、 「表示情報取得元」.「表示項目名」 の形式で設定する。
comment カレンダーについての備考 文字列 × × 設計書の表示時に、 画面項目定義の項目定義一覧で、 「備考」に表示される。
initialValueDesc 初期表示内容に関する説明 文字列 × × 設計書の表示時に、 画面項目定義の項目定義一覧で、 「備考」に表示される。

2.1.46.3. 内部構造・改修時の留意点

部品一覧

パス 内容
/WEB-INF/tags/widget/field/calendar.tag カレンダー日付入力ウィジェット
/WEB-INF/tags/widget/field/base.tag 入力項目ウィジェット共通テンプレート
/js/jsp/taglib/nablarch.js カレンダー日付入力ウィジェットが使用する <n:text> のエミュレーション機能を実装する タグライブラリスタブJS
/css/style/base.less 基本HTMLの要素のスタイル定義。
カレンダーに関する定義もここに含まれる。