サポート > リポジトリ > 入力制御 > [応用例] 百万円単位での入力欄を用意する

隠し項目設定、入力欄の前後の説明文設定、入力フィールド長設定を組み合わせて、百万円単位での入力欄を用意する例を説明します。

プロジェクトモデルの金額項目は、入力・出力時に百万円単位の数値を扱います。しかしデータベースには "1,000,000" という数値が格納されるようになっています。

図1 登録画面
図2 表示画面

検索画面では、丸めた数値ではなく、正確な数値で検索できます。

図3 検索画面

例:プロジェクトモデル

上の例で示したプロジェクトモデルの定義を図4に示します。金額項目は「入力・出力用」用と「検索」用の二つを用意しています。

図4 プロジェクトモデルの定義

金額(入力・出力用)

この項目は入力と出力で用いますが、検索では用いないとします。 はじめに、単位表示のために「入力フィールド」を設定し、入力欄の右側に余白を用意します。

図5 入力フィールド長の指定

「入力制御 > スタイル > 入力欄の後に表示する文字列」に、単位を指定します。

あわせて今回は「入力エリアのカーソル位置」を「右寄せ」とします。

図7 入力欄の後に表示する文字列とカーソル位置の設定

「出力制御 > 詳細画面 > 数値」のフォーマットを3桁区切りとします。

図8 数値フォーマットの指定

「出力制御 > 詳細画面 > スタイル > ラベルの表示内容」を "金額" とします。画面に表示される項目名を "金額" に統一する意図です。(後述する、検索画面でも同様の対応を行います。)

図9 ラベルの表示内容の指定

金額(検索用)

この項目は検索用途です。入力された budget_input 項目の値に 1000000 倍した数値をデータベースに保存します。

図10 計算式の設定

「入力制御 > 隠し項目」の設定を行います。

図11 隠し項目の設定(入力)

同じように「出力制御 > 詳細画面 > 隠し項目」の設定を行います。これによってこの項目は入力、出力ともに画面には表示されません。

あわせて出力フォーマットの設定も行います。

図12 隠し項目の設定(出力)と、出力フォーマットの設定

「検索制御 > スタイル > ラベルの表示内容」を "金額" とします。

図13 検索画面のラベル表示内容の設定