Ein Option Picker als Relationship Picker zum Filtern zweckentfremden

Beschreibung:

Leider gibt es in Budibase keinen Relationship Picker (Dropdownmenü wo man die Liste nochmals filtern kann.
Zum Beispiel Zeige aus der Liste nur einträge von Kunden so und so an.

In Unserem Beispiel haben wir folgende Tabellen.
Kunden
Adressen
Verträge.

Bei Kunden und adressen reicht der Relationship picker noch aus, da wir eine Tabelle filtern.
Sprich wir filtern die Tabelle Adressen nach einem Kunden.
Also einfache Verschachtelung. Kunde -> Adressen.

Spanndend wird es jetzt mit den Verträgen. Denn ein Vertrag hat mehrere Relationen.

Ein Vertrag hate eine Relation zu Kunden und eine Relation zu den Adressen.
Denn ein Kunde kann mehrere Adressen haben,  genauso wie ein Kunde mehrere Verträge haben kann.
Mit dem normalen Relation ship Picker, werden dann wenn beim Vertrag die Adresse ausgewählt werden kann, leider alle Adressen angeben, von allen Kunden.
Wir möchten aber gerne das nur die Adressen von dem Kunden dessen Vertrag gerade bearbeitet wird aufgelistet wird.
Das ganze ist ein wenig tricky, aber es geht.

Hier zur veranschaulichung aus der Tabelle Verträge.
Hier sind zwei Verträge.
Von Anna die Rechnungsadresse am Deich und von John die Holler Landstraße.

Klicken wir im Data view auf den Eintrag um die Straße auszuwählen, werden uns alle angezeigt.
Dieses verhalten wäre im Designview mit nem Relaltionship picker genau das selbe.

Hier dann in einem Relationship Picker im Design view, also unserer App / Screen

Die letzen beiden Adressen sollten nicht angezeigt werden, da diese nicht zu Anna gehören.
Da wir dieses aber mit dem Realtion Picker nicht filtern können müssen wir uns was anderes überlegen.

Der Workaround

Dazu gehen wir in das bearbeiten Sidepanel / Screen oder  hinzufügen Sidepanel / screen wo wir einen vertrag editieren.
Ich habe in meinem Beispiel ein Sitepanel.

Wenn auf den Vertrag geklickt wird, öffnet sich ein Sidepanel

Nun in den Data view Modus. In das Sitepanel gehen.
Nun im Conatiner einen Neuen Data Provider hinzufügen.
Warum genau an der Stelle, damit sich später usner Option Picker dem Sidepanel von der Größe anpasst.
Diesen Data Provider schieben wir dann ganz nach unten (STRG+Pfeilstate drücken zum verschieben)
So das es so aus sieht. Die Fieldgroup und den Picker gibt es noch nicht. Den erstellen wir gleich. Ist aber schon auf dem Bild.

Nun klicken wir auf den New Data Provider

Wir wählen als Daten unsere Tabelle Adressen aus.

Klicken dann auf define Filter.

Wir wählen als feld kundenrel aus, oder wie auch immer ihr das Feld genannt habt, wenn ihr eine interne DB verwendet.
Wenn Ihr mysql verwendet wird eure direkte relationsfeld zum kunden angezeigt, die ihr dann warscheinlich kunden nennt.
Da ich aber die interne DB verwende hab ich ein zweites Feld als pointer. Dieses wähle ich und dann noch bindings auswählen.
Wer mehr zu den Workaround wissen will : Beziehungen Relationships

Nun auf den Blitz klicken und euren State für die kundenid raussuchen die ja schon vorher gespeichert war, da Ihr ja nur Verträge von Kunde XY angezeigt bekommt. So filtern wir dann auch die Adressen nur nach diesem Kunden durch die Stateid

So sieht dann der fertige Filter aus.
Speichern und fertig.

Somit wäre unser filter fertig.
Nun noch eine Fieldgrupper unterhalb des neuen Data Provider anlegen, damit sich die Elemnet die in die Fieldgroup dann anpassen. Hier wählen wir noch aus, das Labels also beschriftungen auf der Linken Seite seien sollen.

Nun erstellen wir in dieser Group unseren Option Picker.
Fangen wir mit den ersten 4 Feldern an:

Name  : name der das Steuerlement bennent, aht keine Auswirkung auf Tabellenfelder etc. Nur für die reine GUI
Field : Manuell per Hand eintragen. Und zwar erstellen wir dadurch ein neues feld. Name beliebig, der Name darf nur nicht in der Tabelle Verträge vorhanden sein.
Denn das wird ein neues Formularfeld, das uns zum zuweisen in der Tabelle zur verfügung steht.
ich habe es rechnungsadressepicker genannt. Dann weis man gleich das ist das Pickerfeld.
Label: Das ist die Beschreibung in der GUI vom Picker

Nun geht  es weiter
Beim Typ kann man auswählen Selct (Also lIste) oder Punkte (Wir nehmen Liste)

Default value machen wir zum Schluss, hier eben überspringen

Options source, wählen wir Data Provider aus.

Nun können wir unter Options provider unseren Data Provider auswählen, den eben gerade erstellten

Unter Label coulumn können wir aus der Tabelle Adressen auswählen, welche Spalte benutzt werden soll das zur Anzeige dient.
In diesem Fall für uns die Adressen, denn die IDS kann ja keiner Lesen.

Und value Column, das ist das was tatsächlich der Wert ist, sprich die Variable hinter dem Picker.
In unserem Fall die _id. Denn wir wollen ja die _id, in dem Feld Rechnungsadresse im der Tabelle Verträge speichern.

Nun noch der Default value.
Wir wollen wenn der Wert in der Tabelle Verträge vergeben ist, das im Picker dieser dann schon drin ist.
Sonst ist mit aktualiseren eines Datensatzes ja blöd, man müsste sich das sont ja vorher merken und wieder neu ausfüllen.
Dazu klicken wir auf den Blitz:

Und wählen:
Repeater

Dann die Rechnungsadresse (wichtig den Link und nicht die rel falls intern DB verwendet wird)

Nun sieht das so aus:

Jetz müssen wir noch per Hand hinter dem Feldnamen .0._id hinzufügen. Denn das ist ein Array/Datensatz und wir wollen nur das ID Feld nicht den ganzen Datensatz. Denn dadurch wird dann im Picker der Wert gesetzt der zur Zeit in dem Datensatz in Verträge angeben ist. Ist n och keine Adresse angeben, wird glücklicher weise Choose angezeigt.
Dann siesht das ganze so aus, nun auf save klicken:

{{ Repeater.vertraege.rechnungsadressemeldeadresse.0._id }}

Nun sieht unsere Sidebar so aus.
Angezeigt wird sogar schon ein Wert, allerdings wenn wir diesen ändern würden und auf speichern klicken, passiwert da noch nichts. Den default Wert laden, das geht natürlich schon, da wir das ja gerade definiert haben.
Also oben auf den Speichern button klicken.
Dann auf define Actions klicken.

Nun auf Save row klicken.
Dann im Fenster auf Add column klicken.
Damit können wir eine spalte überschreiben mit einem anderen Wert.
in diesem Fall aus die Rechnungsadresse aus unserem Picker.

Nun die Rechnungsadresse auswählen, wichtig auch hier wieder dier Link typ also die echte Relation nicht der selbsterstelle pointer. Entfällt natürlich bei einermysql wieder. Ist nur für interne db. SOnst gäb es ja nur den link

Und bei Value auf den Blitz klicken.

Und bei auf das zweite Formular klicken, heißt bei mir Form. Dieses ist fürs Sidepanel.
Denn FormMainTable ist für die Tabelle. Oder wie auch immer eure Formulare heißen

Und dort jetzt den picker auswählen

Dann sieht das ganze so aus:
Nun auf Save klicken.

Nochmals auf Save:

Ergebnis

Nun öffnen wir die App / aktualisieren die App mit F5 und gehen auf Kunden und klicken bei einem kudnen auf Verträge.

Nun öffnet sich die Seite mitb den Verträgen und dort scrollen wir bis zu den Adressen:
Wie zu sehen gehört der Vertrag Anna Schulte und die Adresse ist am Deich

Nun klicken wir auf den Vertrag und scrollen nach unten und sehen, am Deich wurde übernommen

Nun wählen wir eine andere Adresse und sehen es gibt nur 3 Adressen.
Nämlich die , die Anna gehören. Gleichzeitig wählen wir jetzt zz  zz zz aus

Nun scrollen wir wieder nach oben und klciken auf speichern.

Nun wird autoatisch der Vertrag aktualisert mit der neuen Adresse.
Mission erfolgreich.