リンクされたデータテーブル

テーブルの同期を保つ

ページに2つのテーブルがあると想像してください：

1. アカウントテーブル： このテーブル（accountsDatatable）には、すべての顧客アカウントが一覧表示されます。
2. 連絡先テーブル： このテーブル（contactsDatatable）には、各アカウントのすべての連絡先担当者が一覧表示されます。

目的： アカウントテーブルでアカウントを選択すると、連絡先テーブルが自動的に更新され、該当アカウントの連絡先のみを表示するようにしたい その特定の アカウント。

実現方法

アカウントテーブル

• Avonniデータテーブルコンポーネントをドラッグします
• このテーブルにAPI名を設定していることを確認してください accountsDatatable.
• Query Data Sourceを使ってデータソースを設定します
• Accountsオブジェクトを選択します
• データマッピングを設定して列を作成します

連絡先テーブル

• このテーブルも設定されており、すべての連絡先が表示されます。
• テーブルの設定で「Data Source」セクションに移動します。
• 「Query Data Source」オプションを選択します。
• 連絡先情報を保持するオブジェクト（例：「Contact」）を選択します。
• フィルター条件を追加します：

  • 項目： アカウントID （または、連絡先をアカウントに関連付けるフィールド）
  • 演算子： 等しい
  • 値： {{accountsDatatable.selectedRecord.Id}}

    • この式コードにより、連絡先テーブルは、アカウントIDがアカウントテーブルで選択された行のIDと一致する連絡先のみを表示します。
• フィールドを追加して列を作成します。

結果

• ユーザーはアカウントテーブルでアカウント一覧を閲覧します。
• ユーザーはアカウントをクリックします。
• 連絡先テーブルは即座に更新され、選択したアカウントに関連付けられた連絡先のみを表示します。

これにより、テーブルが同期され、スムーズで直感的なユーザー体験が実現します。