Wiki-Quellcode von Dynamische Elemente
Zeige letzte Bearbeiter
| author | version | line-number | content |
|---|---|---|---|
| 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.FormDesigner.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 in der [[Aktionsverarbeitung>>doc: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 | $("[name=tf1]") // Selektiert das nicht-dynamische Eingabefeld tf1. | ||
| 27 | $("[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 | $($("[org_name=tf1]").get(1)) // Selektiert das zweite dynamisch erzeugte Element des Textfelds tf1. | ||
| 34 | {{/code}} |