# Verknüpfte Datentabellen

## Tabellen synchron halten

Stellen Sie sich vor, Sie haben zwei Tabellen auf Ihrer Seite:

1. **Konten-Tabelle:** Diese Tabelle (`accountsDatatable`) listet alle Ihre Kundenkonten auf.
2. **Kontakt-Tabelle:** Diese Tabelle (`contactsDatatable`) listet alle Kontaktpersonen für Ihre Konten auf.

**Das Ziel:** Wenn Sie ein Konto in der Konten-Tabelle auswählen, soll sich die Kontakt-Tabelle automatisch aktualisieren und nur die Kontakte für *jenes spezielle* Konto anzeigen.

## **So setzen Sie es um**

### **Die Konten-Tabelle**

* Ziehen Sie die Avonni Data Table Komponente
* Stellen Sie sicher, dass Sie dieser Tabelle den API-Namen gegeben haben `accountsDatatable`.
* Konfigurieren Sie die Datenquelle mithilfe der Query Data Source
* Wählen Sie das Accounts-Objekt
* Konfigurieren Sie die Datenzuordnungen, um Spalten zu erstellen

<figure><img src="/files/03b399a78983f3689060e34c1dd6084423f1613c" alt=""><figcaption></figcaption></figure>

### **Die Kontakt-Tabelle**

* Auch diese Tabelle ist eingerichtet und zeigt alle Ihre Kontakte.
* Gehen Sie im Einstellungsbereich der Tabelle zum Abschnitt „Data Source“.&#x20;
* Wählen Sie die Option „Query Data Source“.&#x20;
* Wählen Sie das Objekt, das Ihre Kontaktinformationen enthält (z. B. „Contact“).
* Fügen Sie eine Filterbedingung hinzu:
  * Feld: `Account Id` (oder welches Feld auch immer Kontakte mit Konten verknüpft)
  * Operator: `Gleich`
  * Wert: `{{accountsDatatable.selectedRecord.Id}}`
    * Dieser Ausdruckscode sagt der Kontakt-Tabelle, nur Kontakte anzuzeigen, deren Account-ID mit der ID der ausgewählten Zeile in der Konten-Tabelle übereinstimmt.
* Erstellen Sie Spalten, indem Sie Felder hinzufügen.

### **Das Ergebnis**

* Benutzer durchsuchen ihre Kontoliste in der Konten-Tabelle.
* Sie klicken auf ein Konto.
* Die Kontakt-Tabelle wird sofort aktualisiert und zeigt nur die Kontakte an, die mit dem ausgewählten Konto verknüpft sind.

Dies hält Ihre Tabellen synchron und sorgt für ein reibungsloses, intuitives Benutzererlebnis.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.avonnicomponents.com/experience-cloud/experience-cloud-de/tutorials/reaktive-komponenten/verknupfte-datentabellen.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.