ヘッダーをスキップ
Oracle® Application Expressアプリケーション・ビルダー・ユーザーズ・ガイド
リリース4.2 for Oracle Database 12c
B71338-03
  目次へ移動
目次
索引へ移動
索引

前
 
次
 

10.5 ボタンの作成

アプリケーションを設計する際、ボタンを使用して、特定のページまたはURLを表示したり、情報をポストまたは処理するようにできます(たとえば、「作成」、「取消」、「次へ」、「前へ」または「削除」ボタンを作成します)。

ボタンでは、4つの異なるタイプの操作を実行できます。ボタンでは、ページの送信(たとえば、フォーム・ページへの変更を保存するため)、または別のページまたはカスタムURLのいずれかへのリダイレクトを行うか、何も行わない(たとえば、ボタンの動作が「動的アクション」で定義されている場合)ことができます。

内容は次のとおりです。

10.5.1 ウィザードを使用したボタンの作成

ボタンを作成するには、「ページ定義」から「ボタンの作成」ウィザードを実行します。ボタンの作成方法は、ツリー・ビューとコンポーネント・ビューのどちらでページ定義を表示するかによって異なります。詳細は、「ツリー・ビューとコンポーネント・ビューについて」を参照してください。

内容は次のとおりです。

10.5.1.1 コンポーネント・ビューでのボタンの作成

コンポーネント・ビューは、ユーザー・インタフェース要素とアプリケーション・ロジックをコンポーネント・タイプ別にグループ化します。コンポーネント・ビューでボタンを作成するには、ボタンの下で、「作成」アイコンをクリックします。

コンポーネント・ビューでリージョン・ボタンを作成するには、次のステップを実行します。

  1. 該当するページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。

  2. 必要に応じて、リージョンを作成します。「リージョンの理解」を参照してください。

  3. 「ボタン」で、「作成」アイコンをクリックします。

  4. ボタンのリージョンを選択し、「次へ」をクリックします。

  5. ボタンの位置を選択し、「次へ」をクリックします。

    • リージョン位置にボタンの作成: リージョン位置にボタンを配置する場合は、このオプションを選択します。リージョン位置は、リージョン・テンプレートで定義された位置です。

    • このリージョン・アイテムで表示されるボタンの作成: ページ・アイテム内またはページ・アイテム間にボタンを表示する場合は、このオプションを選択します(たとえば、フォーム・フィールドの横にボタンを直接追加する場合)。

  6. 「ボタン属性」で、次のステップを実行します。

    1. ボタン名: 対象のボタンの名前を入力します。「ページの送信」のアクションを行うボタンでは、ボタンの名前がページ・リクエストの値になります。たとえば、ボタンにFLOW_RESET_BUTTONという名前を付けると、送信を行わずにカレント・ページをリセットすることがボタンの目的になります。

    2. ラベル: ボタンに表示するラベルを入力します。

    3. ボタン・スタイル: 使用可能なオプションは次のとおりです。

      • HTMLボタン

      • テンプレート・ベースのボタン

      • イメージ

      ボタンがイメージの場合、イメージ名を指定する必要があります。テンプレートによって制御されるボタンの場合、テンプレート名を選択する必要があります。

    4. ボタン・テンプレート: どのテンプレートでボタンの表示を制御するかを定義します。ボタン・テンプレートは、テンプレート・ページで定義します。少なくとも1つのボタン・テンプレートを定義しておかないと、ボタン・テンプレートを使用できません。

    5. ボタン・タイプ: この属性を使用して、ボタン・テンプレートの「標準」または「ホット」いずれかのテンプレートを選択します。

      「ホット」を選択すると、ボタン・テンプレートの「ホット・テンプレート」属性に格納されたテンプレートを使用してボタンがレンダリングされます。値が定義されない場合、標準のボタン・テンプレートが使用されます。

    6. ボタン属性: 入力したテキストは、HTML要素の定義に追加されます。次の例では、テキスト・ボタンのクラスを設定しています。

      class="myclass"
      

      テンプレートに基づくボタンの場合、テンプレートに#BUTTON_ATTRIBUTES#置換文字列を含める必要があります。これを使用してタブの停止を制御できます。次に例を示します。

      tabindex="3"
      
    7. 「次へ」をクリックします。

    「表示プロパティ」に表示されるオプションは、選択されたリージョン位置によって決まります。

  7. 「表示プロパティ」で、次のステップを実行します。

    • ボタン位置が「リージョン位置にボタンの作成」の場合は、次の項目を指定します。

      • 順序: このコンポーネントの順序を入力します。これによって評価の順序が決まります。

      • 位置: このボタンの位置を選択します。

      • 位置合せ: 「右」または「左」を選択します。

      • 「次へ」をクリックします。

    • ボタン位置が「このリージョン・アイテムで表示されるボタンの作成」の場合は、次の項目を指定します。

      • 順序: このコンポーネントの順序を入力します。これによって評価の順序が決まります。

      • 「次へ」をクリックします。

  8. 「クリックされたときのアクション」で、次のステップを実行します。

    1. アクション: ボタンがクリックされたときの動作を選択します。

      • ページの送信: 「ボタン名」と等しいREQUEST値とともにカレント・ページを送信します。

      • このアプリケーションのページにリダイレクト: オプションの追加プロパティ(ターゲット・ページでの、ページ区切りの再設定、リクエスト値の設定、キャッシュのクリアおよびアイテム値の設定)とともに、現在のアプリケーション内のページにリダイレクトします。

      • URLにリダイレクト: ターゲットURLにリダイレクトします。

      • 動的アクションで定義: 何も行われません。ボタンの動作は、「動的アクション」によって定義されます。

      • 出力可能なレポート問合せのダウンロード: これにより、「ページの送信」ボタンと対応するブランチが作成されます。ボタンがクリックされると、「レポート問合せ」から出力がダウンロードされます。

        このアクションは、アプリケーションの「共有コンポーネント」でレポート問合せを定義している場合にのみ使用可能であることに注意してください。

    2. 検証の実行: 「検証の実行」では、ページ送信時の検証の実行を制御します。たとえば、ユーザーがレコードを削除しているときに、「削除」ボタンに無関係な検証エラー・メッセージを表示しないようにする場合に使用できます。

      オプションは次のとおりです。

      • はい: ページが送信され、この属性が「はい」に設定されている場合、そのページに定義されているすべての検証とすべての組込みの検証が実行されます(たとえば、必須の値が設定されていることを確認するためや、その値が有効な数値や日付であるかどうかを判別するため)。

      • いいえ: 「いいえ」に設定すると、定義済の検証と組込みの検証はいずれも実行されません。

      この設定に関係なく特定の検証を常に実行する場合、検証属性の「常に実行」を「はい」に設定します。詳細は、「検証を実行するタイミングの決定」を参照してください。

    3. 「次へ」をクリックします。

  9. 「条件付き表示」で、対象のコンポーネントをレンダリングするうえで満たす必要がある条件タイプをリストから選択します。

  10. 「ボタンの作成」をクリックします。

10.5.1.2 ツリー・ビューでのボタンの作成

ツリー・ビューには、リージョン、ページ・アイテムおよびアプリケーション・ロジックがツリー内のノードとして表示されます。ツリー・ビューでボタンを作成するには、リージョンを選択し、次の2つのオプションのいずれかを選択します。

  • 「リージョン・ボタンの作成」は、リージョン位置にボタンを表示します。たとえば、リージョン・テンプレートで定義されたとおりに、リージョン位置にボタンを追加します。

  • 「ページ・アイテム・ボタンの作成」は、ボタン・アイテム内またはボタン・アイテム間にボタンを表示します。たとえば、ページ・アイテムの後にボタンを配置する場合にこのオプションを使用します。

ツリー・ビューでリージョン・ボタンを作成するには、次のステップを実行します。

  1. 該当するページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。

  2. 必要に応じて、リージョンを作成します。「リージョンの理解」を参照してください。

  3. ボタンを含めるリージョンを右クリックし、次のいずれかを選択します。

    • リージョン・ボタンの作成: リージョン位置にボタンを表示します。たとえば、リージョン・テンプレートで定義されたとおりに、リージョン位置にボタンを追加します。

    • ページ・アイテム・ボタンの作成: ボタン・アイテム内またはボタン・アイテム間にボタンを表示します(たとえば、ページ・アイテムの後にボタンを配置します)。

  4. 「ボタン属性」で、次のステップを実行します。

    1. ボタン名: 対象のボタンの名前を入力します。「ページの送信」のアクションを行うボタンでは、ボタンの名前がページ・リクエストの値になります。たとえば、ボタンにFLOW_RESET_BUTTONという名前を付けると、送信を行わずにカレント・ページをリセットすることがボタンの目的になります。

    2. ラベル: ボタンに表示するラベルを入力します。

    3. ボタン・スタイル: 使用可能なオプションは次のとおりです。

      • HTMLボタン

      • テンプレート・ベースのボタン

      • イメージ

      ボタンがイメージの場合、イメージ名を指定する必要があります。テンプレートによって制御されるボタンの場合、テンプレート名を選択する必要があります。

    4. ボタン・テンプレート: どのテンプレートでボタンの表示を制御するかを定義します。ボタン・テンプレートは、テンプレート・ページで定義します。少なくとも1つのボタン・テンプレートを定義しておかないと、ボタン・テンプレートを使用できません。

    5. ボタン・タイプ: この属性を使用して、ボタン・テンプレートの「標準」または「ホット」いずれかのテンプレートを選択します。

      「ホット」を選択すると、ボタン・テンプレートの「ホット・テンプレート」属性に格納されたテンプレートを使用してボタンがレンダリングされます。値が定義されない場合、標準のボタン・テンプレートが使用されます。

    6. ボタン属性: 入力したテキストは、HTML要素の定義に追加されます。次の例では、テキスト・ボタンのクラスを設定しています。

      class="myclass"
      

      テンプレートに基づくボタンの場合、テンプレートに#BUTTON_ATTRIBUTES#置換文字列を含める必要があります。これを使用してタブの停止を制御できます。次に例を示します。

      tabindex="3"
      
    7. 「次へ」をクリックします。

    「表示プロパティ」に表示されるオプションは、選択されたリージョン位置によって決まります。

  5. 「表示プロパティ」で、次のステップを実行します。

    • 「リージョン・ボタンの作成」で、次のステップを実行します。

      • 順序: このコンポーネントの順序を入力します。これによって評価の順序が決まります。

      • 位置: このボタンの位置を選択します。

      • 位置合せ: 「右」または「左」を選択します。

      • 「次へ」をクリックします。

    • 「ページ・アイテム・ボタンの作成」で、次を行います。

      • 順序: このコンポーネントの順序を入力します。これによって評価の順序が決まります。

      • 「次へ」をクリックします。

  6. 「クリックされたときのアクション」で、次のステップを実行します。

    1. アクション: ボタンがクリックされたときの動作を選択します。

      • ページの送信: 「ボタン名」と等しいREQUEST値とともにカレント・ページを送信します。

      • このアプリケーションのページにリダイレクト: オプションの追加プロパティ(ターゲット・ページでの、ページ区切りの再設定、リクエスト値の設定、キャッシュのクリアおよびアイテム値の設定)とともに、現在のアプリケーション内のページにリダイレクトします。

      • URLにリダイレクト: ターゲットURLにリダイレクトします。

      • 動的アクションで定義: 何も行われません。ボタンの動作は、「動的アクション」によって定義されます。

      • 出力可能なレポート問合せのダウンロード: これにより、「ページの送信」ボタンと対応するブランチが作成されます。ボタンがクリックされると、「レポート問合せ」から出力がダウンロードされます。

        このアクションは、アプリケーションの「共有コンポーネント」でレポート問合せを定義している場合にのみ使用可能であることに注意してください。

    2. 検証の実行: 「検証の実行」では、ページ送信時の検証の実行を制御します。たとえば、ユーザーがレコードを削除しているときに、「削除」ボタンに無関係な検証エラー・メッセージを表示しないようにする場合に使用できます。

      オプションは次のとおりです。

      • はい: ページが送信され、この属性が「はい」に設定されている場合、そのページに定義されているすべての検証とすべての組込みの検証が実行されます(たとえば、必須の値が設定されていることを確認するためや、その値が有効な数値や日付であるかどうかを判別するため)。

      • いいえ: 「いいえ」に設定すると、定義済の検証と組込みの検証はいずれも実行されません。

      この設定に関係なく特定の検証を常に実行する場合、検証属性の「常に実行」を「はい」に設定します。詳細は、「検証を実行するタイミングの決定」を参照してください。

    3. 「次へ」をクリックします。

  7. 「条件付き表示」で、対象のコンポーネントをレンダリングするうえで満たす必要がある条件タイプをリストから選択します。

  8. 「ボタンの作成」をクリックします。

10.5.2 コンポーネント・ビューでの複数のボタンの作成

コンポーネント・ビューでは、複数のボタンの作成ウィザードを使用して、同じリージョン内に複数の「ページの送信」ボタンを一度に作成できます。

一度に複数のボタンを作成するには、次のステップを実行します。

  1. コンポーネント・ビューで該当するページ定義にナビゲートします。「ツリー・ビューとコンポーネント・ビューの切替え」を参照してください。

  2. 必要に応じて、HTMLリージョンを作成します。「リージョンの理解」を参照してください。

  3. コンポーネント・ビューで「ボタン」セクションを探し、「作成」アイコンをクリックします。

    ボタンの作成ウィザードが表示されます。

  4. 「複数のボタンの作成」リンクをクリックします。

    「複数のボタンの作成」ウィザードが表示されます。

  5. 「リージョン」で、このボタンを含めるリージョンを選択します。

  6. 「テンプレート」からテンプレートを選択します。テンプレートを選択しない場合、HTMLスタイルのボタンが作成されます。

  7. 「HTML属性」で、これらのボタンのHTML属性を指定します。このテキストがHTML要素の定義に追加されます。たとえば、テキスト・ボタンのクラスを次のように設定できます。

    class="myclass"
    
  8. 残りのフィールドに迅速に移入するには、ページの右側にある「クイック・ボタン」リストから選択します。

  9. 「ボタンの作成」をクリックします。

10.5.3 ボタンの編集

ボタンを編集する場合は、「ページ定義」の「ボタン」セクションから開始します。ボタンの属性の変更、一度に複数のボタンの編集、またはリージョン内のボタン位置の変更を行うことができます。

内容は次のとおりです。

10.5.3.1 ボタン属性の編集

ページ・ボタンの編集ページでボタンの属性を編集できます。

既存のボタンの属性を編集するには、次のようにします。

  1. 該当するページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。

  2. ページ・ボタンの編集ページにアクセスします。

    • ツリー・ビュー: 「ページ・レンダリング」で、ボタン名をダブルクリックします。

    • コンポーネント・ビュー: 「ボタン」で、ボタン名を選択します。

      ページ・ボタンの編集ページが表示されます。

  3. ボタン属性を編集します。

    ページ上の特定のアイテムの詳細を表示するには、アイテム・ラベルをクリックします。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。

  4. 「変更の適用」をクリックします。

10.5.3.1.1 「検証の実行」について

「検証の実行」では、ページ送信時の検証の実行を制御します。たとえば、ユーザーがレコードを削除しているときに、「削除」ボタンに無関係な検証エラー・メッセージを表示しないようにする場合に使用できます。

オプションは次のとおりです。

  • はい: ページが送信され、この属性が「はい」に設定されている場合、そのページに定義されているすべての検証とすべての組込みの検証が実行されます(たとえば、必須の値が設定されていることを確認するためや、その値が有効な数値や日付であるかどうかを判別するため)。

  • いいえ: 「いいえ」に設定すると、定義済の検証と組込みの検証はいずれも実行されません。

この設定に関係なく特定の検証を常に実行する場合、検証属性の「常に実行」を「はい」に設定します。詳細は、「検証を実行するタイミングの決定」を参照してください。

10.5.3.2 複数のボタンの同時編集

ボタン・ページを使用して、複数のボタンを削除したり、最近の変更の履歴を表示します。

一度に複数のボタンを編集するには、次のステップを実行します。

  1. 該当するページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。

  2. ページ・ボタンの編集ページにアクセスします。

    • ツリー・ビュー: 「ページ・レンダリング」で、ボタン名を右クリックし、「すべて編集」を選択します。

    • コンポーネント・ビュー: 「すべて編集」アイコンをクリックします。「すべて編集」アイコンは、鉛筆が置かれた小さいグリッドの形をしています。

    ボタン・ページが表示されます。ボタン・ページには、リージョン内のボタンのリストを示す表が含まれています。

  3. 属性を編集し、「変更の適用」をクリックします。

10.5.3.2.1 複数のボタンの削除

一度に複数のボタンを削除するには、次のステップを実行します。

  1. 該当するページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。

  2. ページ・ボタンの編集ページにアクセスします。

    • ツリー・ビュー: 「ページ・レンダリング」で、ボタン名を右クリックし、「すべて編集」を選択します。

    • コンポーネント・ビュー: 「すべて編集」アイコンをクリックします。「すべて編集」アイコンは、鉛筆が置かれた小さいグリッドの形をしています。

      ボタン・ページが表示されます。

  3. 「複数のボタンの削除」をクリックします。

    複数のボタンの削除ページが表示されます。

  4. 削除するボタンを選択して、「ボタンの削除」をクリックします。

10.5.3.2.2 履歴

履歴ページを使用して、ボタンの最近の変更のサマリーを表示します。

10.5.4 ボタン名とREQUESTの関係の理解

「送信」ボタン(送信ページのアクションが指定されたボタン)に付けた名前によって、ページの送信時に組込み属性REQUESTの値が決まります。バインド変数:REQUESTを使用して、PL/SQL内のREQUESTの値を参照できます。このバインド変数を使用して、ユーザーがクリックするボタンに応じてプロセス、検証またはブランチを条件付きで実行できます。ユーザーがボタンをクリックした際に実行されるプロセスを作成することもできます。また、より複雑な条件も使用できます。次に例を示します。

If :REQUEST in ('EDIT','DELETE') then ...
If :REQUEST != 'DELETE' then ...

これらの例では、「EDIT」および「DELETE」という名前のボタンが存在すると想定します。この構文は、PL/SQL式の条件にも使用できます。ただし、ボタン名の大/小文字が保持されることに注意してください。ボタン名をLOGINに指定した場合、名前「Login」を検索するリクエストは失敗します。次に例を示します。

<input type="BUTTON" value="Finish" onclick="apex.submit('Finish');">

この例では、FinishREQUESTの名前で、大/小文字が区別されます。

10.5.5 ボタンを使用したブランチ処理について

各ページには、任意の数のブランチを含めることができます。ブランチは、アプリケーションの他のページまたはURLにリンクします。Application Expressでは、ページ・プロセス中の異なる時点でブランチが検討されます。プロセス前、計算前、検証前およびプロセス後のどの時点でブランチするかを選択できます。アプリケーション・ビルダーの他のコントロールと同様に、ブランチ処理には条件を設定できます。たとえば、ユーザーがボタンをクリックした場合にブランチできます。ブランチを作成する場合は、ブランチを特定のボタンに関連付けます。ブランチは、ユーザーがボタンをクリックした場合にのみ検討されます。

10.5.6 ボタンの条件付き表示

ボタンを条件付きで表示するには、「ページ・ボタンの編集」ページの属性を編集します。

ボタンを条件付きで表示するには、次のステップを実行します。

  1. ボタンを作成します。詳細は、「ウィザードを使用したボタンの作成」を参照してください。

  2. 該当するページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。

  3. ページ・ボタンの編集ページにアクセスします。

    • ツリー・ビュー: 「ページ・レンダリング」で、ボタンを探し、ボタン名をダブルクリックします。

    • コンポーネント・ビュー: 「ボタン」で、ボタン名をクリックします。

  4. 「条件」までスクロールします。

  5. 「条件タイプ」リストから選択します。

  6. 表示されるフィールドに式を入力します。

  7. 「変更の適用」をクリックします。