Komponenten für Optionen

Anstatt die ID in der URL zu verwenden, können Sie auch eine Filterung mit einer speziellen Select Komponente mit der Möglichkeit, ein Land aus der Liste auszuwählen. Zuvor haben wir bereits die Relselect Komponente verwendet, und die Logik ihrer Arbeit ist sehr ähnlich, aber dank der Selectkönnen wir nicht nur eine Auswahl aus allen verfügbaren Ländern anbieten, sondern auch unsere eigenen Optionen hinzufügen.

Select Komponente

Schauen wir uns die Select die Auswahl, die bestimmt, welche Städte aus welchen Ländern in der Tabelle erscheinen sollen, und die Möglichkeit, generell alle verfügbaren Städte anzuzeigen, wurde hinzugefügt.

Beim Erstellen einer Select Komponente muss diese mit Optionen gefüllt werden, aus denen die Auswahl getroffen werden soll. Um dies zu tun, wie in Relselectmüssen Sie eine allgemeine Liste von Ländern erhalten. Diese Liste senden wir dann aber nicht direkt an Select direkt, sondern wandeln sie in verfügbare Optionen um, von denen jede als ein Select Option Modell. Deshalb deklarieren wir das Select Options Array als Variable und füllen es in einer Schleife mit den notwendigen Daten.

In diesem Beispiel sind die wesentlichen Select Options Felder für uns sein Label (der Text der vorgeschlagenen Option) und Value (sein numerischer Bezeichner). Setzen Sie diese Werte auf den Namen des Landes und seine Kennung.

Wenn die Schleife abgeschlossen ist, sollten wir eine weitere Option erstellen und hinzufügen, die alle verfügbaren Städte ohne Filterung nach Ländern anzeigt. Setzen wir Label = World und Value = 0.

Wenn Sie eine Option auswählen, wird der Select onChange Trigger ausgelöst. Verwenden wir ihn, um die ausgewählte Option herauszufinden und in die neue globale Variable zu schreiben Country selected. In diesem Fall ist es notwendig, eine zusätzliche Prüfung vorzunehmen, und wenn die letzte Option (alle verfügbaren Städte) ausgewählt wurde, dann sollte der Wert dieser Variablen auf leer gesetzt werden (null).

Die letzte Aktion dieses Geschäftsprozesses ist das Anklicken der Schaltfläche Refresh Schaltfläche, die die Daten in der Tabelle auffrischt. Der Geschäftsprozess muss ebenfalls leicht geändert werden, um das Auftauchen einer neuen Variable zu berücksichtigen.

Jetzt können wir auswählen, welche Städte aus welchem Land in der Tabelle angezeigt werden sollen.

Dropdown Komponente

Betrachten wir zum Schluss noch eine weitere Komponente, mit der Sie verschiedene Optionen auswählen können - Dropdown. Der Hauptunterschied besteht darin, dass die Auswahl einer bestimmten Option sofort eine Aktion auslösen sollte, anstatt nur die ausgewählte Option zu speichern. Sie kann als eine Schaltfläche mit erweiterter Funktionalität bezeichnet werden.

Verwenden wir zum Beispiel Dropdown als Ersatz für die Schaltfläche "Land löschen" in der Tabelle. Jetzt wird der Eintrag in der Datenbank nicht sofort gelöscht, sondern es werden zusätzliche Optionen aufgerufen, mit denen Sie die Löschung entweder bestätigen oder abbrechen können.

Beginnen wir mit der allgemeinen Konfiguration der Komponente. Wir wählen ihr Aussehen und die verfügbaren Optionen.

Als Nächstes werden wir den Geschäftsprozess selbst erstellen. Und die erste Aktion darin wird sein, den Datensatz zu ermitteln, für den die Schaltfläche Dropdown angeklickt wurde. Bei normalen Schaltflächen wird dieser Wert als Record IDübergeben, aber in diesem Fall wird nicht einmal der Dropdown selbst gedrückt werden, sondern seine untergeordnete Komponente mit der gewünschten Option. Daher ist die Ermittlung der Eintrags-ID etwas komplizierter.

Bei sich wiederholenden Tabellenelementen besteht die Component ID besteht aus zwei Teilen, die durch ein "-"-Zeichen getrennt sind. Der erste Teil ist die Standard-Komponenten-ID. Der zweite Teil ist jedoch nur die Datensatz-ID, durch deren Hinzufügung der Bezeichner der sich wiederholenden Komponenten eindeutig wird.

Da wir dies wissen, müssen wir nur diese ID erhalten. Dazu teilen wir die Zeichenkette in zwei Teile auf (Split string) und finden den Wert des zweiten Teils heraus (index = 1)

In einem nächsten Schritt müssen wir herausfinden, welche Option ausgewählt wurde.

Wenn es sich tatsächlich um eine Option zur Bestätigung der Löschung handelt, führen Sie den entsprechenden Befehl aus. Andernfalls können Sie nichts tun, da eine Aktion nicht erforderlich ist.

Das Löschen von Datensätzen aus der Datenbank ist nun vor versehentlichen Klicks geschützt.