フルーツショップ †

顧客からの受注を登録する業務アプリケーションのサンプルです。このサンプルでは LiveValidation プラグインでユーザからの入力をリアルタイムで検証し、エラーメッセージを表示する機能が使用されています。

↑

アプリケーション画面 †

Internet Explorer 8 以降のブラウザでは動作保障外となりました。

↑

操作方法 †

↑

[受注登録] タブ †

  1. [顧客コード] テキストボックスに顧客コード (半角数字 4 ケタ) を入力して [検索] ボタンを押下すると、顧客情報 (データは架空のものです) が表示されます。
  2. [商品コード] テキストボックスに商品コード (半角英大文字 1 ケタ + 半角数字 2 ケタ) を入力して検索ボタンを押下すると、商品情報 (データは架空のものです) が表示されます。
    • [顧客コード]、[商品コード] テキストボックスの隣にある [？] ボタンを押下すると入力補助ダイアログが表示されます。
  3. [数量] テキストボックスに数量を入力して [追加] ボタンをクリックすると、[受注明細] グリッドに明細行が 1 行追加されます。
  4. 注文を続ける場合は [商品コード]、[数量] の入力を繰り返します。注文を確定する場合は [受注登録] ボタンを押下します。
↑

[受注一覧] タブ †

  1. [更新] ボタンを押下すると受注情報一覧が更新されます。
↑

[マスタ管理] タブ †

  1. 新しく登録したい顧客の情報を登録します。各テキストボックスには以下の入力値検証ルールが設定されており、キーボード入力時やフォーカス取得・喪失時に即時検証が実行されます。
    • 顧客名: 入力必須
    • 郵便番号: 入力必須、文字数 (7文字)、正規表現 (数字7ケタ)、独自ルール (東京都の郵便番号)
    • 住所: 入力必須
    • 電話番号: 入力必須、正規表現 (数字およびハイフン)
    • FAX番号: 正規表現 (数字およびハイフン)
    • 担当者名: 入力必須
  2. [登録ボタン] を押下すると上記のルールが一括検証されます。いずれかの項目にエラーがある場合にはアラートダイアログが表示され、登録処理が中止されます。
  3. すべての入力項目でエラーがなければ顧客情報の登録が行われ、登録完了メッセージが表示されます。