Wiki-Quellcode von Beispiele JavaScript und CSS

Verstecke letzte Bearbeiter
tki 15.1 1 Auf dieser Seite und den Unterseiten werden diverse Beispiele und Formular zu vielen verschiedenen Themen angeboten.
sas 1.1 2
3 Alle Beispiele können auch direkt auf der Demo-Plattform eingesehen werden.
4
gru 7.3 5 - **URL der Demo-Plattform**: [[https:~~/~~/demo7.formcycle.eu/formcycle>>https://demo7.formcycle.eu/formcycle||rel="__blank noopener noreferrer" target="_blank"]]
sas 1.1 6 - **Benutzername**: demo@demo
7 - **Passwort**: {{html}}pa55w0rd@demo{{/html}}
8
sas 8.1 9 Im folgenden Teil finden Sie eine Auflistung der vorhandenen Beispielformulare auf dem Demo-Server.
sas 1.1 10
gru 9.2 11 {{content/}}
12
sas 8.1 13 == Berechnung ==
sas 1.1 14
sas 37.1 15 ; [[Formularbespiele für Berechnungselement>>https://formexchange.formcycle.eu:443/formcycle/form/alias/104/widget_formula||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
sas 8.1 16 : Beispiele für Subtraktion, Summenbildung und String-Verkettung
17
sas 52.1 18 == Zähler ==
19
20 ; [[Beispiel für die Verwendung eines Zählers>>https://demo7.formcycle.eu/formcycle/form/alias/52/counter/]]
21 : Es wird demonstriert wie der aktuelle Zählerstand im Formular ausgegeben werden kann, Termine welche ausgebucht sind zu sperren und im Workflow den Zähler zu verwenden
22
sas 22.1 23 == Datenquellen und Abfragen ==
sas 8.1 24
sas 12.1 25 ; [[Autocomplete Funktionen>>https://demo7.formcycle.eu/formcycle/form/alias/52/autocomplete_functions_2||rel="noopener noreferrer" target="_blank"]]
sas 9.1 26 : Beispiel für die Verwendung von Autocomplete mit CSV oder Datenbank als Quelle.
sas 8.1 27
sas 12.1 28 ; [[Filterung einer Auswahl anhand eines Wertes>>https://demo7.formcycle.eu/formcycle/form/alias/52/filter_selection||rel="noopener noreferrer" target="_blank"]]
sas 8.1 29 : Wenn die Auswahl erfolgt ist, soll in einer weiteren Auswahlliste die Werte anhand der Eingabe gefiltert werden. Dabei kann nur eine Datenbank als Quelle verwendet werden.
30
sas 49.1 31 ; [[Vorbelegung von Daten aus einer Datenquelle>>https://demo7.formcycle.eu/formcycle/form/alias/52/prefilling_data||rel="noopener noreferrer" target="_blank"]]
sas 24.1 32 : Daten aus einer Datenquelle Feldern im Formular zuweisen.
sas 8.1 33
sas 49.1 34 ; [[Übertragung von Werten einer Auswahlliste>>https://formexchange.formcycle.eu/formcycle/form/alias/104/transfer_select_column/||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
sas 24.1 35 : Demo um den Wert einer beliebigen Spalte einer Datenquelle in ein anderes Feld zu übertragen.
sas 8.1 36
sas 54.1 37 ; [[Datenbankabfrage>>https://formexchange.formcycle.eu/formcycle/form/alias/104/database_query/||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
38 : Abfrage von Daten aus einer Datenbank mit festen Werten.
39
sas 30.1 40 ; [[LDAP-Abfrage über Auswahl-Feld und Autocomplete>>https://demo7.formcycle.eu/formcycle/form/alias/52/ldap_query_selection||rel="noopener noreferrer" target="_blank"]]
41 : Auswahlfeld mit Werten aus einer LDAP-Abfrage befüllen und mittels Autocomplete LDAP-Daten abfragen.
sas 8.1 42
sas 14.1 43 == Datum und Zeit ==
44
sas 40.1 45 ; [[Kalender Funktionen>>https://formexchange.formcycle.eu:443/formcycle/form/alias/104/calendar_functions||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
sas 24.1 46 : Demo für verfügbare Funktionen zur Konfiguration des Kalender Widgets.
sas 14.1 47
sas 39.1 48 ; [[Datum und Zeit initialisieren>>https://formexchange.formcycle.eu:443/formcycle/form/alias/104/date_time_initialization||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
sas 24.1 49 : Sobald das Formular geöffnet ist, erfolgt die initiale Belegung des Datum und Zeit Wertes.
tki 14.2 50
sas 42.1 51 ; [[Datumsdifferenz in Tagen>>https://formexchange.formcycle.eu/formcycle/form/alias/104/date_difference_in_days/||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
tki 15.1 52 : Differenz in Tagen von Datepicker
53
sas 43.1 54 ; [[Datumsauswahlbereich einschränken und Validierung>>https://formexchange.formcycle.eu/formcycle/form/alias/104/datepicker_validation/||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
sas 24.1 55 : Erleichtert die Eingabe von Datumsbereichen und ermöglicht entsprechende Validierung.
tki 15.1 56
sas 44.1 57 ; [[Formatierung Geburtstagsfeld>>https://formexchange.formcycle.eu/formcycle/form/alias/104/formatting_birthday_field/||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
tki 15.1 58 : Konfiguration des Kalenders
59
sas 44.1 60 ; [[Alter berechnen>>https://formexchange.formcycle.eu:443/formcycle/form/alias/104/calculating_age/||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
61 : Demo zur Berechnung des Alters anhand des Geburtstagsdatums.
62
sas 17.1 63 ; [[Zeitunterschied berechnen>>https://demo7.formcycle.eu/formcycle/form/alias/52/time_difference/||rel="noopener noreferrer" target="_blank"]]
tki 15.1 64 : Differenz und Summe von Uhrzeiten
65
sas 17.1 66 ; [[Zeitvalidierung>>https://demo7.formcycle.eu/formcycle/form/alias/52/time_validation/||rel="noopener noreferrer" target="_blank"]]
tki 15.1 67 : Vergleich einer Zeitauswahl
68
sas 27.1 69 == Terminverwaltung ==
70
71 ; [[Vorbelegung Terminauswahl>>https://demo7.formcycle.eu/formcycle/form/alias/52/pre-assign-appointment/||rel="noopener noreferrer" target="_blank"]]
sas 28.1 72 : Demo wie es möglich ist ein Datum in Terminverwaltung vorzubelegen innerhalb des Formulars.
sas 27.1 73
tki 15.1 74 == Aussehen ==
75
sas 17.1 76 ; [[Änderung der Textposition>>https://demo7.formcycle.eu/formcycle/form/alias/52/change_text_position/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 77 : Demonstration Text anders zu positionieren.
tki 15.1 78
sas 17.1 79 ; [[Ändern des Ladesymbols>>https://demo7.formcycle.eu/formcycle/form/alias/52/change_loading_symbol/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 80 : Individualisieren des Ladesymbols beim Formularaufruf.
tki 15.1 81
sas 17.1 82 ; [[Anpassen von wiederholenden Elementen>>https://demo7.formcycle.eu/formcycle/form/alias/52/customize_repeating_elements/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 83 : Nutzen Sie Ihre eigenen Knöpfe für wiederholende Elemente.
tki 15.1 84
sas 32.1 85 ; [[Nummerierung wiederholbarer Elemente mit CSS>>https://formexchange.formcycle.eu:443/formcycle/form/alias/104/numbering_repeatable_elements_css||rel="noopener noreferrer" target="_blank"]]
sas 24.1 86 : Wiederholende Formularelemente werden fortlaufend nummeriert mittels CSS.
sas 31.1 87 :
sas 32.1 88 ; [[Nummerierung wiederholbarer Elemente mit JavaScript>>https://formexchange.formcycle.eu:443/formcycle/form/alias/104/numbering_repeatable_elements_js||rel="noopener noreferrer" target="_blank"]]
sas 31.1 89 : Wiederholende Formularelemente werden fortlaufend nummeriert mittels JavaScript.
tki 15.1 90
sas 19.1 91 ; [[Eigene Schriftart im Formular verwenden>>https://demo7.formcycle.eu/formcycle/form/alias/52/using_own_font/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 92 : Eigene Schriftart über CSS einbinden und anwenden.
sas 19.1 93
tki 15.1 94 == Allgemein ==
95
sas 51.1 96 ; [[Übertragung von Eingaben in andere Elemente>>https://demo7.formcycle.eu/formcycle/form/alias/52/copy_input_values/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 97 : Felder mit Werten vorbelegen, die in einem anderen Feld eingegeben wurden.
tki 15.1 98
sas 17.1 99 ; [[Löschen von Formulardaten>>https://demo7.formcycle.eu/formcycle/form/alias/52/delete_form_data/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 100 : Zeigt, wie einzelne oder alle Eingabefelder in einem Formular gelöscht werden können, wenn ein Button gedrückt wird.
tki 15.1 101
sas 26.1 102 ; Sprachauswahl
103 : Um eine Auswahlmöglichkeit für die Sprache zu ermöglichen, sollte das [[Widget Sprachauswahlelement>>doc:Formcycle.PluginDocumentation.WidgetXLanguageSwitchPlugin||target="_blank"]] verwendet werden.
tki 15.1 104
sas 17.1 105 ; [[Lokaler Import und Export von Formdaten>>https://demo7.formcycle.eu/formcycle/form/alias/52/local_import_export/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 106 : Formularinhalte lokal als XML zwischenspeichern und wieder laden.
tki 15.1 107
sas 17.1 108 ; [[Werte vor dem Senden setzen>>https://demo7.formcycle.eu/formcycle/form/alias/52/set_value_before_sending/||rel="noopener noreferrer" target="_blank"]]
tki 15.1 109 : Vor dem Versenden eines Formulars das Formular prüfen und Werte setzen.
110
sas 20.1 111 ; [[Seriennummer erzeugen>>https://demo7.formcycle.eu/formcycle/form/alias/52/serial_number/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 112 : Seriennummern mithilfe des Datenbank-Zählers erzeugen.
sas 20.1 113
sas 21.1 114 == Formatierung ==
115
sas 55.1 116 ; [[Formatierung von Zahlen (Autonumeric Konfiguration)>>https://formexchange.formcycle.eu/formcycle/form/provide/223/||rel="noopener noreferrer" target="_blank"]] (im Formular-Store verfügbar)
sas 21.1 117 : Automatische Formatierung eines Textfeldes in ein konfiguriertes Format und Einheit (autonumeric)
118
119 ; [[Formatierung unterschiedlicher Eingabetypen>>https://demo7.formcycle.eu/formcycle/form/alias/52/different_input_formatting/||rel="noopener noreferrer" target="_blank"]]
120 : Demo für Zeit- und benutzerdefinierte Formatierung anhand der Bibliothek cleave.js
121
tki 16.1 122 == Validierung ==
sas 8.1 123
sas 17.1 124 ; [[Bedingungen für Mehrfachauswahlwerte>>https://demo7.formcycle.eu/formcycle/form/alias/52/contraints_multiselect_values/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 125 : Demo, wie es möglich ist, die Sichtbarkeit eines Elements in Abhängigkeit von mehreren Werten einer Auswahl zu ändern.
tki 15.1 126
sas 17.1 127 ; [[Beispiele für Validationsregeln>>https://demo7.formcycle.eu/formcycle/form/alias/52/validation_rules/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 128 : Verschiedene Beispiele für reguläre Ausdrücke bei benutzerdefinierten Datentypen.
sas 1.1 129
sas 17.1 130 ; [[IBAN Validierung>>https://demo7.formcycle.eu/formcycle/form/alias/52/iban_validation/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 131 : Beispiel für clientseitigen IBAN-Validator
132
sas 17.1 133 ; [[Mussfeld in Abhängigkeit eines Status>>https://demo7.formcycle.eu/formcycle/form/alias/52/required_field_on_status/||rel="noopener noreferrer" target="_blank"]]
sas 24.1 134 : Demo wie es möglich ist, ein erforderliches Feld in Abhängigkeit von einem Status zu setzen.
sas 29.1 135
136 ; [[Benutzerdefinierte Bedingung>>https://demo7.formcycle.eu/formcycle/form/alias/52/custom_condition/||rel="noopener noreferrer" target="_blank"]]
137 : Demo-Formular um eigene Bedingungen an Eingabefeldern zu definieren.
tki 16.1 138
139 == Word (Fill) Beispiel ==
140
sas 17.1 141 ; [[Word (Fill) - Checkboxen und Radiobuttons>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-cb/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 142 : Demonstriert Beispiele für die Funktion cb()
143
sas 17.1 144 ; [[Word (Fill) - Word (Fill) - Zählen, Enthält, Ersetzen>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-cnt-con-rep/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 145 : Demonstriert Beispiele für die Funktion cnt(), con(), rep()
146
sas 17.1 147 ; [[Word (Fill) - Bilder und URL>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-img-url/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 148 : Demonstriert Beispiele für die Funktion image(), b64img() und url()
149
sas 47.1 150 ; [[Word (Fill) - Merge Field>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-mergefield/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 151 : Demonstriert Beispiele für ein Merge Field, welches in der Fusszeile verwendet werden kann
152
sas 17.1 153 ; [[Word (Fill) - Funktionen zum Entfernen>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-rm/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 154 : Demonstriert Beispiele für die Funktion rmp(), rmr(), rmt(), rmtp()
155
sas 17.1 156 ; [[Word (Fill) - Wiederholende Elemente>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-repeat/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 157 : Beispiele für die Verwendung wiederholender Elemente in einem Word-Dokument.
158
sas 17.1 159 ; [[Word (Fill) - Auswahl-Funktionen>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-lst/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 160 : Demonstriert Beispiele für die Funktion lsttxt(), lsttitle(), lst()
161
sas 17.1 162 ; [[Word (Fill) - Bild aus Uploadfeld übertragen>>https://demo7.formcycle.eu/formcycle/form/alias/52/word-fill-upload-to-img/||rel="noopener noreferrer" target="_blank"]]
tki 16.1 163 : Wandelt einen Upload in Bild um
164
sas 24.1 165 == Workflow ==
166
167 ; [[Temporäre Zwischenspeichern von Formulardaten>>https://demo7.formcycle.eu/formcycle/form/alias/52/save_form_temporarily/||rel="noopener noreferrer" target="_blank"]]
168 : Speichern des aktuellen Formularzustands, damit dieses später zu Ende ausgefüllt werden kann.
169
sas 1.1 170 == Weitere Demos ==
171
sas 5.1 172 {{subpages depth="2" title="Demo-Beispiele"/}}