| ... |
... |
@@ -1,7
+1,5 @@ |
| 1 |
1 |
Manchmal ist es sinnvoll, bei dynamischen Elementen eine fortlaufende Nummer anzuzeigen. Statt die Nummerierung im {{smallcaps}}Html{{/smallcaps}} fest zu hinterlegen, können wir sie dynamisch durch {{smallcaps}}Css{{/smallcaps}} hinzufügen. |
| 2 |
2 |
|
| 3 |
|
-Zuerst fügen wir im {{designer case="dat"/}} ein [[Auswahlelement>>doc:Formcycle.FormDesigner.FormElements.Input]] zum Formular hinzu. Dem Auswahlelement geben wir den Namen //tfEmail//. |
| 4 |
|
- |
| 5 |
5 |
{{figure image="gettingstarted_css_counter_repeatable_elements_de.png" width="600"}} |
| 6 |
6 |
Anzeige einer fortlaufenden Nummer an wiederholbaren Elementen. Unter den Grundeigeschaften wird das Element wiederholbar gemacht. Im CSS-Bereich wird die Nummerierung mittels CSS-Zählern hinzugefügt. |
| 7 |
7 |
{{/figure}} |
| ... |
... |
@@ -8,11
+8,11 @@ |
| 8 |
8 |
|
| 9 |
9 |
== Änderungen im Formular == |
| 10 |
10 |
|
| 11 |
|
-Zuerst müssen wir das Formularelement wiederholbar schalten. Dazu setzen wir das Häkchen bei der Einstellung im {{designer/}} unter [[Grundeigenschaften>>doc:Formcycle.FormDesigner.ElementProperties.BaseProperties]]. |
|
9 |
+Zuerst fügen wir im {{designer case="dat"/}} einige Formularelement zum Formular hinzu. Nun schalten wie die Formularelemente wiederholbar. Dazu setzen wir das Häkchen bei der Einstellung im {{designer/}} unter [[Grundeigenschaften>>doc:Formcycle.FormDesigner.ElementProperties.BaseProperties]]. |
| 12 |
12 |
|
| 13 |
13 |
== Änderungen im CSS-Bereich == |
| 14 |
14 |
|
| 15 |
|
-Im [[{{smallcaps}}Css{{/smallcaps}}-Bereich>>doc:Formcycle.FormDesigner.CodingPanel.CSSTab.WebHome]] können wir nun die Nummerierung vornehmen. Dies geschieht mit den CSS-Eigenschaften //counter-reset// sowie //counter-increment//. Im {{smallcaps}}CSS{{/smallcaps}} kann es einen oder mehrere Zähler geben. Jeder Zähler hat einen Namen und einen aktuellen Zahlenwert. Und wann zählt ein Zähler hoch? Das funktioniert wie folgt: |
|
13 |
+Im [[{{smallcaps}}Css{{/smallcaps}}-Bereich>>doc:Formcycle.FormDesigner.CodingPanel.CSSTab.WebHome]] können wir nun die Nummerierung vornehmen. Dies geschieht mit den {{smallcaps}}Css{{/smallcaps}}-Eigenschaften //counter-reset// sowie //counter-increment//. Im {{smallcaps}}Css{{/smallcaps}} kann es einen oder mehrere Zähler geben. Jeder Zähler hat einen Namen und einen aktuellen Zahlenwert. Und wann zählt ein Zähler hoch? Das funktioniert wie folgt: |
| 16 |
16 |
|
| 17 |
17 |
* Der Anfangswert ist 0. |
| 18 |
18 |
* Nun wird die HTML-Struktur des Formulars von oben nach unten durchgegangen. |