Von Version < 67.1 >
bearbeitet von nlo
am 10.05.2019, 14:26
Auf Version < 80.7 >
bearbeitet von gru
am 30.09.2020, 13:49
< >
Änderungskommentar: Es gibt keinen Kommentar für diese Version

Zusammenfassung

Details

Seiteneigenschaften
Dokument-Autor
... ... @@ -1,1 +1,1 @@
1 -XWiki.nlo
1 +XWiki.gru
Inhalt
... ... @@ -5,11 +5,11 @@
5 5  
6 6  Die Quellen bzw. Datenquellen werden als Text im Format CSV, JSON oder XML hinterlegt und können über den {{designer case="acc"/}} bzw. das Formular verarbeitet werden.
7 7  
8 -Um auch im Skriptbereich per Javaskript auf die Datenquellen Zugriff zu haben, werden alle Datenquellen in eine JSON-Struktur umgewandelt und im Objekt {{code}}XFC_METADATA.urls.datasource_[csv|json|xml]{{/code}} zugänglich gemacht. Die Struktur dieser JSON-Struktur für die verschiedenen Datenquellen ist im jeweiligen Abschnitt erläutert.
8 +Um auch im Skriptbereich per Javaskript auf die Datenquellen Zugriff zu haben, werden alle Datenquellen in eine JSON-Struktur umgewandelt und im Objekt {{code language="none"}}XFC_METADATA.urls.datasource_[csv|json|xml]{{/code}} zugänglich gemacht. Die Struktur dieser JSON-Struktur für die verschiedenen Datenquellen ist im jeweiligen Abschnitt erläutert.
9 9  
10 10  {{info}}
11 11  **Servlet-URL**
12 -Die Servlet-URL einer Datenquelle wird nach dem Anlegen in der Konfigurationsoberfläche dargestellt (siehe Punkt 4 in der [[Abbildung>>||anchor="fig_data_source"]]) und ist im JS-Objekt {{code}}XFC_METADATA.urls.datasource_[csv|json|xml]{{/code}} verfügbar.
12 +Die Servlet-URL einer Datenquelle wird nach dem Anlegen in der Konfigurationsoberfläche dargestellt (siehe Punkt 4 in der [[Abbildung>>||anchor="fig_data_source"]]) und ist im JS-Objekt {{code language="none"}}XFC_METADATA.urls.datasource_[csv|json|xml]{{/code}} verfügbar.
13 13  {{/info}}
14 14  
15 15  == Anlegen einer Datenquelle ==
... ... @@ -53,12 +53,12 @@
53 53  
54 54  __Drag&Drop__
55 55  
56 -Datenquellen können auch per Drag&Drop importiert werden. Wird eine Datei über die Liste (grüner Bereich gezogen), so wird eine neue Datenquelle vom entsprechenden Typ angelegt (bei Excel-Dateien wird eine Datenquelle pro Arbeitsblatt angelegt). Wird die Datenquelle allerdings über den Editierbereich einer bereits existierenden Datenquelle gezogen, so wird diese aktualisiert. Die Änderungen werden allerdings erst mit einem Klick auf "Speichern" {{icon name="save"/}} übernommen.
56 +Datenquellen können auch per Drag&Drop importiert werden. Wird eine Datei über die Liste (grüner Bereich) gezogen, so wird eine neue Datenquelle vom entsprechenden Typ angelegt (bei Excel-Dateien wird eine Datenquelle pro Arbeitsblatt angelegt). Wird die Datenquelle allerdings über den Editierbereich einer bereits existierenden Datenquelle gezogen, so wird diese aktualisiert. Die Änderungen werden allerdings erst mit einem Klick auf "Speichern" {{icon name="save"/}} übernommen.
57 57  
58 58  == CSV ==
59 59  
60 60  {{figure image="data_source_csv_servlet_json_comparison.png"}}
61 -Die JSON-Struktur einer CSV-Datenquelle. Auf diese JSON-Struktur kann per Javascript über {{code}}XFC_METADATA.urls.datasource_csv{{/code}} zugegriffen werden. (1) Links ist die JSON-Struktur der Datenquelle dargestellt, bei welcher die erste Zeile nicht als Header verwendet wird. Stattdessen werden Header in Form von {{code}}colX{{/code}} verwendet. (2) Rechts ist die Datenquelle zu sehen, wenn die erste Zeile als Header verwendet wird.
61 +Die JSON-Struktur einer CSV-Datenquelle. Auf diese JSON-Struktur kann per Javascript über {{code language="none"}}XFC_METADATA.urls.datasource_csv{{/code}} zugegriffen werden. (1) Links ist die JSON-Struktur der Datenquelle dargestellt, bei welcher die erste Zeile nicht als Header verwendet wird. Stattdessen werden Header in Form von {{code language="none"}}colX{{/code}} verwendet. (2) Rechts ist die Datenquelle zu sehen, wenn die erste Zeile als Header verwendet wird.
62 62  {{/figure}}
63 63  
64 64  CSV-Datenquellen können in einer Quellcode-Ansicht oder in einer Tabellenansicht dargestellt werden. Die Ansicht kann mit einem Klick auf die entsprechende Schaltfläche {{ficon name="table-large"/}}/{{icon name="code"/}} in der Fußzeile unterhalb des Editierbereichs geändert werden.
... ... @@ -73,22 +73,22 @@
73 73  Zum Bearbeitung einer CSV-Tabelle befinden sich unterhalb des Editierbereichs eine Reihe von Schaltflächen:
74 74  
75 75  * {{ficon name="plus-circle"/}} **Einfügen**: Fügt neue Zeilen oder Spalten relativ zur derzeit selektierten Zelle ein.
76 -* {{ficon name="trash-alt2"/}} **Entfernen**: Entfernt die selektierte Zeile oder Spalte oder leert die selektierte Zelle.
76 +* {{ficon name="trash-alt2"/}} **Entfernen**: {{html}}Entfernt die selektierte(n) Zeile(n) oder Spalte(n) oder leert die selektierte Zelle.{{/html}}
77 77  * {{icon name="upload"/}} **Importieren**: Öffnet den [[Dialog zum Importieren von CSV-Datenquellen>>||anchor="data_source_import_csv"]].
78 78  * {{icon name="code"/}} **Quellcode-Ansicht**: Wechselt in die Quellcode-Ansicht.
79 79  
80 80  === Header von CSV-Datenquellen ===
81 81  
82 -Für CSV-Datenquellen gibt es eine zusätzliche Option in den Datenquelleinstellungen. Die Option **Erste Zeile ist Header** regelt den Zugriff auf die Werte der Datenquelle über das entsprechende Servlet ({{code}}XFC_METADATA.urls.datasource_csv{{/code}}):
82 +Für CSV-Datenquellen gibt es eine zusätzliche Option in den Datenquelleinstellungen. Die Option **Erste Zeile ist Header** regelt den Zugriff auf die Werte der Datenquelle über das entsprechende Servlet ({{code language="none"}}XFC_METADATA.urls.datasource_csv{{/code}}):
83 83  
84 84  * **Aktiviert**:
85 -Die Zellen der erste Zeile werden als Schlüssel bzw. {{code}}keys{{/code}} für den Zugriff auf die Werte der jeweiligen Spalte verwendet (siehe [[Anwendungsbeispiel>>||anchor="data_source_csv_example"]]).
85 +Die Zellen der erste Zeile werden als Schlüssel bzw. {{code language="none"}}keys{{/code}} für den Zugriff auf die Werte der jeweiligen Spalte verwendet (siehe [[Anwendungsbeispiel>>||anchor="data_source_csv_example"]]).
86 86  * **Deaktiviert**:
87 -Die Schlüssel bzw. {{code}}keys{{/code}} für den Zugriff auf die Werte der einzelnen Datensätze/Zeilen sind durchnummeriert, beginnend mit {{code}}0{{/code}}. Diese Schlüssel haben folgende Form: {{code}}colX{{/code}}, wobei {{code}}X{{/code}} für den Index der Spalte steht.
87 +Die Schlüssel bzw. {{code language="none"}}keys{{/code}} für den Zugriff auf die Werte der einzelnen Datensätze/Zeilen sind durchnummeriert, beginnend mit {{code language="none"}}0{{/code}}. Diese Schlüssel haben folgende Form: {{code language="none"}}colX{{/code}}, wobei {{code language="none"}}X{{/code}} für den Index der Spalte steht.
88 88  
89 89  {{lightbox image="data_source_csv_settings_de.png" title="Die Option **Erste Zeile ist Header** regelt den Zugriff auf die Werte der Datenquelle über das entsprechende Servlet"/}}
90 90  
91 -CSV-Datenquellen können im {{designer case="dat"/}} über das //Servlet// mit Namen {{code}}XFC_METADATA.urls.datasource_csv{{/code}} ausgelsen werden.
91 +CSV-Datenquellen können im {{designer case="dat"/}} über das //Servlet// mit Namen {{code language="none"}}XFC_METADATA.urls.datasource_csv{{/code}} ausgelsen werden.
92 92  
93 93  === Servlet-Parameter ===
94 94  
... ... @@ -97,7 +97,7 @@
97 97  http(s):~/~/<server>/formcycle/datenquellecsv?mandantName=<Mandant-Name>&name=<Datenquellen-Name>
98 98  {{/info}}
99 99  
100 -Bei Zugriff aus dem {{designer case="dat"/}} verwenden Sie immer das globale Variablen-Objekt //XFC_METADATA//, siehe hierzu auch [[Globale Designer Variablen>>https://jsdocs.formcycle.eu/jsdocs/de/modules/_formcycle_v6_de_d_.html#xfc_metadata||target="_blank"]]. Beispielsweise kann wie folgt darauf zugegriffen werden: {{code}}XFC_METADATA.urls.datasource_csv{{/code}}.
100 +Bei Zugriff aus dem {{designer case="dat"/}} verwenden Sie immer das globale Variablen-Objekt //XFC_METADATA//, siehe hierzu auch [[Globale Designer Variablen>>https://jsdocs.formcycle.eu/jsdocs/de/modules/_formcycle_v6_de_d_.html#xfc_metadata||target="_blank"]]. Beispielsweise kann wie folgt darauf zugegriffen werden: {{code language="none"}}XFC_METADATA.urls.datasource_csv{{/code}}.
101 101  
102 102  Folgende Parameter sind möglich:
103 103  
... ... @@ -104,16 +104,18 @@
104 104  |=Parametername|=Beschreibung|=Erforderlich
105 105  |name|Muss dem Namen der CSV-Datenquelle entsprechen.|Ja
106 106  |mandantName|Muss dem Namen des Mandanten entsprechen, unter welchen diese Datenquelle erstellt wurde.|Ja, wenn //projektId// nicht gegeben.
107 -|projektId|Muss der ID des Formulars entsprechen. Diese Information kann über {{code}}XFC_METADATA.currentProject.id{{/code}} abgerufen werden.|Ja, wenn //mandantName// nicht gegeben.
107 +|projektId|Muss der ID des Formulars entsprechen. Diese Information kann über {{code language="none"}}XFC_METADATA.currentProject.id{{/code}} abgerufen werden.|Ja, wenn //mandantName// nicht gegeben.
108 108  |kopfzeile|Gibt eine Komma-separierte Liste der Spaltennamen der CSV-Tabelle an. Ist dieser nicht angegeben, so wird hierfür die erste Zeile der CSV-Tabelle verwendet.|Nein
109 109  |spaltenNamen|Gibt eine kommaseparierte Liste der Spalten an, welche Spalten vom //Servlet// mit den entsprechenden Werten zurückgeliefert werden. Hierbei werden je nach Verwendung die Namen der Spalten aus dem Parameter //kopfzeile// oder die Namen der ersten Zeile der //CSV//-Datenquelle erwartet.|Nein
110 -|csvTrennzeichen|Gibt das Trennzeichen zwischen den einzelnen Datenzellen an. Wird dieses nicht gesetzt, wird hier standardmäßig ein Komma {{code}},{{/code}} benutzt.|Nein
111 -|csvQuote|Das Trennzeichen, mit dem die Werte der Zeilen getrennt sind. Wird dieses nicht gesetzt, wird hier standardmäßig ein Anführungszeichen verwendet {{code}}"{{/code}}.| Nein
110 +|csvTrennzeichen|Gibt das Trennzeichen zwischen den einzelnen Datenzellen an. Wird dieses nicht gesetzt, wird hier standardmäßig ein Komma {{code language="none"}},{{/code}} benutzt.|Nein
111 +|csvQuote|Das Trennzeichen, mit dem die Werte der Zeilen getrennt sind. Wird dieses nicht gesetzt, wird hier standardmäßig ein Anführungszeichen verwendet {{code language="none"}}"{{/code}}.| Nein
112 112  
113 113  {{id name="data_source_csv_example"/}}
114 114  
115 115  === Anwendungsbeispiel ===
116 116  
117 +Es wurde eine CSV-Datenquelle mit folgendem Inhalt angelegt, bei welcher die **erste Zeile als Header** verwendet wird.
118 +
117 117  {{code language="csv"}}
118 118  anrede,vorname,nachname,plz,ort
119 119  Herr,Max,Mustermann,1000,Musterhausen
... ... @@ -122,7 +122,7 @@
122 122  
123 123  {{/code}}
124 124  
125 -Im {{designer case="dat"/}} wird dann folgendes Skript im [[Skriptbereich>>doc:Formcycle.FormDesigner.CodingPanel.WebHome]] verwendet.
127 +Im {{designer case="dat"/}} wird dann folgendes Skript im [[Skriptbereich>>doc:Formcycle.FormDesigner.CodingPanel.WebHome]] verwendet, um die Felder im Formular vorzubefüllen.
126 126  
127 127  {{code language="javascript"}}
128 128  $.getJSON( XFC_METADATA.urls.datasource_csv + "?name=Demo&mandantName=xima.de", function(json) {
... ... @@ -138,7 +138,7 @@
138 138  
139 139  {{lightbox image="data_source_csv_designer_script_de.png"/}}
140 140  
141 -Dieses Beispiel als Datenquelle für den {{designer case="acc"/}} [[zum Herunterladen>>attach:CSV-Demo_de.json||rel="__blank"]].
143 +Dieses Beispielformular für den {{designer case="acc"/}} [[zum Herunterladen>>attach:CSV-Demo_de.json||rel="__blank"]].
142 142  
143 143  === Sonderfall Auswahlelement ===
144 144  
... ... @@ -146,28 +146,32 @@
146 146  Die Anbindung einer Datenquelle an eine Auswahlelement erfolgt direkt im {{designer case="dat"/}}
147 147  {{/figure}}
148 148  
149 -Soll die //CSV//-Datenquelle direkt in ein [[Auswahlelement>>doc:Main.Auswahl]] geladen werden, erfolgt dies über die Eigenschaften des Auswahlelements im {{designer case="dat"/}}.
151 +Soll die //CSV//-Datenquelle direkt in ein [[Auswahlelement>>doc:Formcycle.FormDesigner.FormElements.Selection.WebHome]] geladen werden, erfolgt dies über die Eigenschaften des Auswahlelements im {{designer case="dat"/}}.
150 150  
151 -Der Inhalt der CSV-Datenquelle wird folgendermaßen in einem [[Auswahlelement>>doc:Main.Auswahl]] verarbeitet.
153 +Der Inhalt der CSV-Datenquelle wird folgendermaßen in einem [[Auswahlelement>>doc:Formcycle.FormDesigner.FormElements.Selection.WebHome]] verarbeitet:
152 152  
153 -{{code}}
154 -sichtbarer wert, übertragener, wert, optionaler wert, optionaler wert, ...
155 +{{code language="none"}}
156 +sichtbarer wert, übertragener wert, optionaler wert, optionaler wert, ...
155 155  {{/code}}
156 156  
157 -Werden mehr als der sichtbare und übertragene Wert angegeben, also optionale Werte, so können diese im Javaskript über den folgenden jQuery-Selektor abgerufen werden.
159 +Die Spalten der Datenquelle werden für [[Auswahlelemente>>doc:Formcycle.FormDesigner.FormElements.Selection.WebHome]] wie folgt bezeichnet:
160 +{{code language="none"}}col + Index der Spalte{{/code}}.
158 158  
162 +Beitzt die Datenquelle mehr als 2 Spalten, besitzt sie optionale Werte. Auf die optionalen Werte kann im Javascript über den folgenden jQuery-Selektor zugegriffen werden:
163 +
159 159  {{code language="javascript"}}
160 -$('[name=sel2]').find('option:selected').attr('col0');
165 +$('[name=sel2]').find('option:selected').attr('col2');
161 161  {{/code}}
162 162  
163 -Jeder optionale Wert wird am Auswahlelement als Attribut {{code}}col + Index des optionalen Wert{{/code}} gespeichert. Bei z.B. drei optionalen Werten würde es also //col0//, //col1// und //col2// geben.
168 +Die optionalen Werte beginnen also mit Spaltenindex 2.
169 +Ist die erste Zeile als Header markiert, so wird diese für das Auswahlelement ignoriert.
164 164  
165 165  == XML ==
166 166  
167 -Die XML Datenquelle verhält sich analog zur //CSV//-Datenquelle, kann jedoch nicht direkt an ein [[Auswahlelement>>doc:Main.Auswahl]] gebunden werden.
173 +Die XML Datenquelle verhält sich analog zur //CSV//-Datenquelle, kann jedoch nicht direkt an ein [[Auswahlelement>>doc:Formcycle.FormDesigner.FormElements.Selection.WebHome]] gebunden werden.
168 168  
169 -{{figure image="datenquelle_xml.png" width="300"}}
170 -Die JSON-Struktur der XML-Datenquelle. Auf diese JSON-Struktur kann dann per Javaskript über {{code}}XFC_METADATA.urls.datasource_[csv|json|xml]{{/code}} zugegriffen werden.
175 +{{figure image="data_source_xml_servlet_json.png" width="300"}}
176 +Die JSON-Struktur der XML-Datenquelle. Auf diese JSON-Struktur kann dann per Javascript über {{code language="none"}}XFC_METADATA.urls.datasource_xml{{/code}} zugegriffen werden.
171 171  {{/figure}}
172 172  
173 173  === Beispiel für eine XML-Datenquelle ===
... ... @@ -207,7 +207,7 @@
207 207  http(s):~/~/<server>/formcycle/datenquellexml?mandantName=<Mandant-Name>&name=<Datenquellen-Name>
208 208  {{/info}}
209 209  
210 -Bei Zugriff aus dem {{designer case="dat"/}} verwenden Sie immer das globale Variablen-Objekt //XFC_METADATA//, siehe hierzu auch [[Globale Designer Variablen>>doc:Main.Formular-Metadaten]]. Beispielsweise kann wie folgt darauf zugegriffen werden: {{code language="javascript"}}XFC_METADATA.urls.datasource_xml{{/code}}.
216 +Bei Zugriff aus dem {{designer case="dat"/}} verwenden Sie immer das globale Variablen-Objekt //XFC_METADATA//, siehe hierzu auch [[Globale Designer Variablen>>https://jsdocs.formcycle.eu/jsdocs/de/interfaces/_formcycle_v6_de_d_.formcyclede.xfcmetadata.html]]. Beispielsweise kann wie folgt darauf zugegriffen werden: {{code language="javascript"}}XFC_METADATA.urls.datasource_xml{{/code}}.
211 211  
212 212  Folgende Parameter sind möglich:
213 213  
... ... @@ -217,10 +217,10 @@
217 217  
218 218  == JSON ==
219 219  
220 -Die //JSON//-Datenquelle verhält sich analog zur //CSV//-Datenquelle, kann jedoch nicht direkt an ein [[Auswahlelement>>doc:Main.Auswahl]] gebunden werden.
226 +Die //JSON//-Datenquelle verhält sich analog zur //CSV//-Datenquelle, kann jedoch nicht direkt an ein [[Auswahlelement>>doc:Formcycle.FormDesigner.FormElements.Selection.WebHome]] gebunden werden.
221 221  
222 -{{figure image="datenquelle_json.png" width="300"}}
223 -Die JSON-Struktur der JSON-Datenquelle. Sie ist identisch mit der JSON-Datenquelle. Auf diese JSON-Struktur kann dann per Javaskript über {{code}}XFC_METADATA.urls.datasource_[csv|json|xml]{{/code}} zugegriffen werden.
228 +{{figure image="data_source_json_servlet_json.png"}}
229 +Die JSON-Struktur der JSON-Datenquelle. Sie ist identisch mit der JSON-Datenquelle. Auf diese JSON-Struktur kann dann per Javascript über {{code language="none"}}XFC_METADATA.urls.datasource_json{{/code}} zugegriffen werden.
224 224  {{/figure}}
225 225  
226 226  === Beispiel für eine JSON-Datenquelle ===
... ... @@ -227,16 +227,16 @@
227 227  
228 228  {{code language="json"}}
229 229  {"person":[
230 - {
231 - 'anrede':'Herr',
232 - 'vorname':'Max',
233 - 'nachname':'Mustermann'
234 - },
235 - {
236 - 'anrede':'Frau',
237 - 'vorname':'Monika',
238 - 'nachname':'Musterfrau'
239 - }
236 + {
237 + "anrede":"Herr",
238 + "vorname":"Max",
239 + "nachname":"Mustermann"
240 + },
241 + {
242 + "anrede":"Frau",
243 + "vorname":"Monika",
244 + "nachname":"Musterfrau"
245 + }
240 240  ]}
241 241  {{/code}}
242 242  
data_source_json_servlet_json.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.nlo
Größe
... ... @@ -1,0 +1,1 @@
1 +5.4 KB
Inhalt
data_source_xml_servlet_json.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.nlo
Größe
... ... @@ -1,0 +1,1 @@
1 +5.6 KB
Inhalt
Copyright 2000-2024