参照ページの作成

詳細アイコン 詳細

  1. アプリケーション・ナビゲータで、「データ・コントロール」パネルを開き、「FODModuleDataControl」ノードを開きます。
  2. 「構造」ウィンドウで、「OrdersView1」ノードを「tr:panelGroupLayout」にドラッグ・アンド・ドロップします。「作成」ポップアップ・メニューから「フォーム」 次の選択 「トリニダード読取り専用フォーム」の順に選択します。
    詳細アイコン 詳細
  3. 「フォーム・フィールドの編集」ダイアログで、「OrderId」「OrderDate」「OrderStatusCode」「OrderTotal」および「CustomerId」以外のフィールドをすべて選択します。次に、削除アイコン 削除」をクリックします。「ナビゲーション・コントロールを含める」「送信ボタンを含める」の選択が解除されていることを確認し、「OK」をクリックします。
  4. ビジュアル・エディタで、フォーム・フィールドの「#{...OrderId...label}」をクリックします。
  5. プロパティ・インスペクタの「Label」フィールドで、さらに読みやすくなるように、移入された値#{bindings.OrderId.hints.label}の最後にコロン(:)1個と空白2個を追加して、[Enter]を押します。
  6. 「OrderDate」「OrderStatusCode」「OrderTotal」および「CustomerId」の各フィールドに対して、ステップ4および5の手順を繰り返します。
  7. 保存アイコン すべて保存」をクリックして作業内容を保存します。
  8. 「データ・コントロール」パネルで、「OrdersView1」ノードを開き、「操作」を開きます。
  9. 「先頭へ」を、「構造」ウィンドウの「tr:panelHeader」「tr:panelGroupLayout」の間にドラッグ・アンド・ドロップします。「作成」メニューから「操作」 次の選択 「トリニダード・ボタン」の順に選択します。
    詳細アイコン 詳細
  10. 「データ・コントロール」パネルで、「前へ」をドラッグし、「構造」ウィンドウの「tr:commandButton - First」の後にドロップします。「作成」メニューから「操作」 次の選択 「トリニダード・ボタン」の順に選択します。
  11. 「次」をドラッグし、「構造」ウィンドウの「tr:commandButton - Previous」の後にドロップします。「作成」メニューから「操作」 次の選択 「トリニダード・ボタン」の順に選択します。
  12. 「最後へ」をドラッグし、「構造」ウィンドウの「tr:commandButton - Next」の後にドロップします。「作成」メニューから「操作」 次の選択 「トリニダード・ボタン」の順に選択します。
  13. コンポーネント・パレットのトリニダード・ページで、「コマンド・ボタン」をドラッグし、「構造」ウィンドウの「tr:commandButton - Last」の後にドロップします。
  14. プロパティ・インスペクタで、「Text」プロパティ・フィールドにEditと入力します。次に、「Action」プロパティの 下矢印 ドロップダウン・リストから「goEdit」を選択します。
  15. 「データ・コントロール」パネルで、「OrdersView1」ノードの下にある「OrderItemsView2」をドラッグし、最後のフォーム・フィールドの下のページにドロップします。「作成」メニューから「表」 次の選択 「トリニダード読取り専用表」の順に選択します。
  16. 「表の列の編集」ダイアログで「ソート」を選択します。
  17. 「LineItemId」「Quantity」「UnitPrice」および「ProductName」以外のすべての列を選択します。削除アイコン 削除」をクリックします。次に、「OK」をクリックします。
  18. ビジュアル・エディタで、列「 #{...LineItemId...label}」をクリックします。プロパティ・インスペクタで、「HeaderText」プロパティの値を削除してIDと入力し、[Enter]を押します。
  19. この手順を繰り返して、「Quantity」列のヘッダー・テキストをQuanに、「UnitPrice」列の名前をPriceに、「ProductName」列の名前をNameに変更します。
  20. 「構造」ウィンドウで「tr:table」を選択します。プロパティ・インスペクタで、「幅」フィールドに100%と入力して[Enter]を押します。
  21. 保存アイコン すべて保存」をクリックします。
    詳細アイコン IDE表示の詳細説明
キュー・カード・アイコン 次のステップ