Overview
Dieses Tutorial erklärt, wie man Datenbankeinträge in einer paginierten Tabelle mit Chronoforms8 anzeigt. Es erläutert die Konfiguration einer "Daten lesen"-Aktion zum Abrufen von Einträgen und einer Tabellenansicht zum Anzeigen, dann das Hinzufügen einer Bearbeitungsseite mit Formularfeldern und einer "Daten speichern"-Aktion zum Aktualisieren von Einträgen. Der Prozess umfasst das Erstellen von Links von der Tabelle zu Bearbeitungsseiten und die Rückleitung zur Liste nach dem Speichern von Änderungen.
In diesem Tutorial werden wir Einträge in einer Datenbanktabelle auflisten und die Liste in einer Tabelle mit Chronoforms8 anzeigen.
Um die Daten aufzulisten und einen Paginator zu haben, müssen wir der Tabellenansicht die Eintragsliste zusammen mit der Anzahl der Einträge in unserer Tabelle liefern, also benötigen wir insgesamt 3 Elemente auf unserer Seite:

- Eine "Daten lesen"-Aktion zum Lesen der Tabelleneinträge und Zählen dieser
- Die Tabellenansicht dient zur Anzeige der Einträge in einer Liste.
Schauen wir uns an, wie die "Daten lesen"-Aktion konfiguriert ist:

- Zuerst müssen wir die Datenbanktabelle auswählen, aus der die Einträge gelesen werden sollen.
- Dann müssen wir den Lesetyp auf "alle passenden Einträge mit Zählung" setzen, um eine Eintragsliste und auch die Gesamtanzahl zu erhalten.
- Dann müssen wir sicherstellen, dass unsere Eintragsliste seitenweise, sortierbar und mit einem Limit, z.B. 10 Einträge pro Seite, versehen ist.
- Die Sortiereinstellung ist optional, aber ich habe sie so konfiguriert, dass nach der Titelspalte in der ausgewählten Tabelle sortiert wird:
Dann muss unsere Tabellenansicht konfiguriert werden, um die Eintragsliste und die Eintragsanzahl von beiden "Daten lesen"-Aktionen zu erhalten und eine Liste von Einträgen anzuzeigen, die mindestens eine Spalte zeigt:

- In der Datenquelle geben wir den Namen der "Daten lesen"-Aktion ein, die "read_data5" ist. Dies weist die Tabelle an, die Eintragsliste & die Anzahl der Einträge und andere Einstellungen von der "Daten lesen"-Aktion zu lesen.
- Wir müssen mindestens eine Tabellenspalte hinzufügen, wir wählen hier die Titelspalte, diese Spalte hat immer einen Wert in der von uns gewählten Datenbanktabelle
Speichern Sie das Formular und jetzt sollten Sie eine Liste aller Einträge in Ihrer Tabelle haben. Wenn die Einträge mehr als 10 sind, haben Sie auch einen Paginator, um durch die Eintragsliste zu navigieren.
Erstellen eines Links zu einer Bearbeitungsseite in Ihrer Tabelle
1- Nach dem Speichern des Formulars hat die Tabellenansicht einen neuen Bereich namens "title". Dort werden wir eine Text Node-Ansicht hinzufügen, um zu einer anderen Seite für die Bearbeitung des Eintrags zu verlinken:

2- Für jede Zeile gibt es eine Variable namens "row", die ein Array aller Spaltennamen & -werte enthält. Um den Wert der "title"-Spalte zu erhalten, können wir {var:row.title} verwenden
3- Wir benötigen, dass der Textknoten zu einer anderen Seite verlinkt, daher aktivieren wir das "Link URL"-Verhalten und setzen die Basis-Link-URL auf {url:}, um die URL der aktuellen Seite zu erhalten
4- In den URL-Parametern müssen wir den Seitennamen des Links mit "chronopage=edit" und die ID der Zeile mit "id={var:row.id}" setzen. Jetzt sollte der Link so aussehen: aktuelle-seiten-url&chronopage=edit&id=zeilen-id
Unsere Titelspalte sollte jetzt einen verlinkten Titelwert anzeigen:

Wir können jetzt eine neue Seite zu unserem Formular mit der Schaltfläche "Neue Seite" am unteren Rand des Designers hinzufügen:

In unserem neuen Seiten-Optionsbereich:
1- müssen wir den Seitenalias auf "edit" setzen, um mit dem von uns erstellten Link übereinzustimmen
2- wir müssen unserer neuen Seite auch einen anderen Seiten-Gruppennamen geben, um über direkte Links erreichbar zu sein:

Dann benötigen wir in unserem neuen Bearbeitungsseiten-"Lade"-Bereich eine "Daten lesen"-Aktion, um den Eintrag der übergebenen ID zu lesen:

1- Wir wählen dieselbe Tabelle wie zuvor
2- Wir setzen "Daten lesen" darauf, einen einzelnen Eintrag zu lesen
3- Wir aktivieren das "Where-Statement"-Verhalten
4- Wir setzen das Where-Statement, um die Zeile mit der "id"-Spalte zu erhalten, die dem Wert des Datenparameters namens "id" entspricht
Unsere neue "Daten lesen"-Aktion heißt "read_data18". Wenn wir die geladenen Werte testen müssen, können wir eine HTML-Ansicht hinzufügen und versuchen, den Wert der "title"-Spalte anzuzeigen:

Das sollte wie erwartet funktionieren, aber in unserem Fall benötigen wir eine Bearbeitungsseite, also benötigen wir einige Formularfelder, um den Eintrag zu bearbeiten. Wir werden ein einzelnes Textfeld für den Titel des Eintrags als Beispiel hinzufügen:

1- Wir müssen das "Data Merge"-Verhalten aktivieren, um die Felder mit den Daten des Eintrags zu laden
2- wir fügen unser Feld hinzu, 3- nennen es "title", um mit dem Namen der Tabellenspalte übereinzustimmen
4- Wir fügen eine Schaltfläche hinzu, um die "edit"-Seite abzusenden
Ein Klick auf den Link in unserer Tabelle sollte jetzt das Bearbeitungsformular anzeigen:

Änderungen am Eintrag speichern
Um Änderungen, die auf der Bearbeitungsseite vorgenommen wurden, zu speichern, müssen wir eine "Daten speichern"-Aktion zum "Absenden"-Bereich der Bearbeitungsseite hinzufügen:

1- Wechseln Sie zum "Absenden"-Bereich der Bearbeitungsseite
2- Fügen Sie eine "Daten speichern"-Aktion hinzu
3- Setzen Sie den Tabellennamen auf dieselbe Tabelle, die in Ihrer Anwendung verwendet wird
Wir müssen dann die "Daten speichern"-Aktion konfigurieren, um den geöffneten Eintrag mit einem Where-Statement zu aktualisieren:

1- Aktivieren Sie das "Where-Statement"-Verhalten
2- Aktivieren Sie das "Modify Data Source"-Verhalten
3- setzen Sie den Where-Wert auf id={data:id}, was bedeutet, dass wir Einträge aktualisieren, bei denen die id-Spalte mit dem Wert des id-Parameters in der URL übereinstimmt
4- In "Modify Data Source" setzen Sie die Daten wie folgt:

Wir setzen unsere Datenquelle als ein Array, bei dem die Titelspalte gleich dem Wert des "title"-Feldes in unserem Bearbeitungsformular ist
Schließlich müssen wir nach dem Speichern zurück zur Auflistungsseite umleiten:

1- Fügen Sie eine Redirect-Aktion unter der "Daten speichern"-Aktion hinzu
2- setzen Sie die Basis-URL auf {url:}, um die aktuelle URL zu erhalten
3- Aktivieren Sie das "Redirect Parameters"-Verhalten und
4- Setzen Sie den chronopage-Parameter auf "page1", was der Standardalias der ersten Formularseite ist, auf der wir unsere Tabelle haben

Speichern Sie das Formular und Ihr Formular sollte jetzt die Titelaktualisierungen speichern und zurück zur Liste umleiten

Comments: