Wiki-Quellcode von Dynamische Elemente


Zeige letzte Bearbeiter
1 {{content/}}
2
3 In Formularen können sog. dynamische Elemente vorkommen. Diese Felder werden während der Eingabe dupliziert. Ein typisches Beispiel ist hier die Angabe von z.B. im Haushalt lebenden Personen. Wählt man z.B. //5// aus, wird der entsprechende Block fünfmal angezeigt. Ein weiteres Beispiel ist die Möglichkeit von beliebig vielen [[Uploads>>doc:Formcycle.Designer.Form.FormElements.Upload]].
4
5 {{figure image="FCDynam.png"}}
6 Ein Anwendungsbeispiel für dynamische Elemente. Es werden die Daten von Studenten erfasst, die Anzahl der Studenten ist dabei variabel.
7 {{/figure}}
8
9 Wiederholbare Elemente werden direkt im {{designer/}} oder mittels der JavaScript-Funktion {{jsdoc page="jquery" name="dynamic"/}} erzeugt.
10
11 == Selektierung dynamischer Elemente ==
12
13 Innerhalb der möglichen Aktionen werden dynamische Elemente wie folgt behandelt.
14
15 Wird ein dynamisches Element später im [[Posteingang>>doc:Formcycle.UserInterface.MyForms.Inbox]] oder im [[Workflow>>doc:Formcycle.Designer.Workflow.WebHome]] verwendet, werden die Werte aller seiner dynamischen Elemente mit einem Komma verbunden zurückgeliefert. Bei Einrichtung eines neuen Spalte im Postfach für das dynamische Feld mit dem Namen //tf1// etwa erscheinen dann in der Spalte im Postfach alle Werte kommasepariert.
16
17 Im Formular selber erhält jedes duplizierte Element einen Namen nach dem Schema //Elementname_index//. So würden, wenn drei Stück des Elements //tf1// existieren, die Felder mit Namen //tf1_0,// //tf1_1// und //tf1_2// erzeugt werden. Auf diese Felder kann auch direkt mit diesen Namen in Postfächern oder in der Aktionsverarbeitung zugegriffen werden.
18
19 Um alle duplizierten Elemente zu selektieren, kann auf diese mit dem Attribut //org_name// statt //name// zugegriffen werden.
20
21 == Beispiele ==
22
23 Alle dynamisch erzeugten Felder eines ursprünglichen Formularfelds werden mit //org_name// selektiert.
24
25 {{code language="javascript"}}
26 $("[data-name=tf1]") // Selektiert das nicht-dynamische Eingabefeld tf1.
27 $("[data-org-name=tf2]") // Selektiert alle dynamisch erzeugten Versionen des Eingabefelds tf2.
28 {{/code}}
29
30 Um etwa das zweite duplizierte Element eines dynamischen Elements mit dem Namen //tf1// zu selektieren, kann folgender Code verwendet werden.
31
32 {{code language="javascript"}}
33 $($("[data-org-name=tf1]").get(1)) // Selektiert das zweite dynamisch erzeugte Element des Textfelds tf1.
34 {{/code}}