Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- software:tim:smartform_basics [2016/01/05 14:05]
jan.mayer
+++ software:tim:smartform_basics [2021/07/01 09:52] (aktuell)
@@ Zeile 24: / Zeile 24: @@
 ===== Verwendung von Frameworks =====
 {{ :software:tim:bs.png?}}
-Um die Web-Entwicklung komfortabler zu gestalten, wurden in den letzten Jahren zahlreiche HTML, CSS und JavaScript Frameworks entwickelt. In der Smartform-Entwicklung setzen wir bei TIM regelmäßig [[http://www.getbootstrap.org | Bootstrap]] ein. **Boostrap** stellt vorgefertigte CSS-Klassen zur Verfügung, die die Entwicklung eines ansprechenden sowie responsiven Smartform-Design ermöglichen. Wie Bootstrap in ein Formular eingebunden wird, zeigen wir anhand unseres ausführlichen [[smartform-example | Enwicklungsbeispiel]].
+Um die Web-Entwicklung komfortabler zu gestalten, wurden in den letzten Jahren zahlreiche HTML, CSS und JavaScript Frameworks entwickelt. In der Smartform-Entwicklung setzen wir bei TIM regelmäßig [[https://www.getbootstrap.com/ | Bootstrap]] ein. **Boostrap** stellt vorgefertigte CSS-Klassen zur Verfügung, die die Entwicklung eines ansprechenden sowie responsiven Smartform-Design ermöglichen. Wie Bootstrap in ein Formular eingebunden wird, zeigen wir anhand unseres ausführlichen [[smartform-example | Enwicklungsbeispiel]]. Neben **Bootstrap** erfreuen sich Bibliotheken mit Web-Komponenten wie [[ http://www.polymer-project.org | Polymer ]] zunehmender Verwendung.
-Neben Bootstrap ist die JavaScript-Bibliothek [[https://jquery.com/ | jQuery]] wichtiger Bestandteil der Smartform-Entwicklung. Die umfangreichen API stellt zahlreiche Funktionen zur Verfügung, z.B. zum Abfangen von User-Input. \\
+Neben Bootstrap und Polymer ist die JavaScript-Bibliothek [[https://jquery.com/ | jQuery]] wichtiger Bestandteil der Smartform-Entwicklung. Die umfangreichen API stellt zahlreiche Funktionen zur Verfügung, z.B. zum Abfangen von User-Input. \\
+Für sehr aufwendige Smartforms mit komplizierten Berechnungen bzw. Anfragen hat sich das von Google entwickelte Framework AngularJS als äußerst nützlich erwiesen.
 Natürlich können Sie jederzeit eigene Frameworks entweder über den HTML-Code der Smartform oder über die custom.js-Datei (wird im [[smartform-example | Entwicklungsbeispiel]] erläutert) einbinden.
+{{:software:tim:angularJs.png?150}}
 ----
 ===== Ein geeigneter Editor =====
-{{:software:tim:brackets.jpg?128 }}
+{{ :software:tim:brackets.jpg?150}}
+Ein Smartform lässt sich mit einem einfachen Texteditor erstellen. Allerdings bieten speziell für die Programmierung ausgelegte Editoren zahlreiche Vorteile, wie Zeileneinrückung, Code-Highlighting oder Auto-Vervollständigung. \\ Beliebte Editoren sind z.B. [[https://notepad-plus-plus.org/ | Notepad++]], [[http://brackets.io/ | Brackets]] und [[http://www.sublimetext.com/3 | Sublime Text]].
+----
 === Formular erstellen ===
@@ Zeile 60: / Zeile 63: @@
 ----
-=== Formular für alle T!M user sichtbar machen ===
+=== Formular für alle TIM user sichtbar machen ===
-Mit dem Attribut security="all" wird jedem T!M-User erlaubt das Formular einzusehen.
+Mit dem Attribut security="all" wird jedem TIM-User erlaubt das Formular einzusehen.
@@ Zeile 76: / Zeile 79: @@
 Die zu der HTML gehörige Javascript Datei befindet sich innerhalb des JBoss in dem Verzeichnis :
-  .....server\default\deploy\loom.ear\loom-portal.war\custom\
+  <jboss>/standalone/deployments/tim.ear/loom-portal.war/custom/
 In dem Ordner welcher zu dem benutzen Mandanten gehört befindet sich eine Datei mit dem Name **custom.js**. Dies ist eine Javascript Datei, die automatisch in das HTML Formular eingebunden wird und somit für die Smarform benutzbar ist. Sollten für das Formular Javascript Funktionen benötigt werden, so können diese in der Datei formuliert werden.
@@ Zeile 276: / Zeile 279: @@
 {{ :software:tim:table_select.png }}
-Um eine Selectbox zu erstellen, sind ein öffnendes <select> und ein schließendes </select> - Tag notwendig. Um diesem Optionen zur Auswahl hinzuzufügen, können zwischen den  <select> - Tags beliebig viele **options** hinzugefügt werden. Jede Option benötigt das Attribut 'value=""' dessen Inhalt unterschiedlich zum Text zwischen den <option> - Tags ist und nicht angezeigt wird. Über das 'value=""' - Attribut werden in T!M Prozessvariablen gesetzt und abgefragt.
+Um eine Selectbox zu erstellen, sind ein öffnendes <select> und ein schließendes </select> - Tag notwendig. Um diesem Optionen zur Auswahl hinzuzufügen, können zwischen den  <select> - Tags beliebig viele **options** hinzugefügt werden. Jede Option benötigt das Attribut 'value=""' dessen Inhalt unterschiedlich zum Text zwischen den <option> - Tags ist und nicht angezeigt wird. Über das 'value=""' - Attribut werden in TIM Prozessvariablen gesetzt und abgefragt.
@@ Zeile 349: / Zeile 352: @@
 ----
+===Formatierungen in Textareas===
+Um die Formatierungselemente kursiv, fettdruck, unterstrichen, blaue Schriftfarbe und rote Schriftfarbe in einer Textarea bereitszustellen muss die Klasse **richtext** mitgegeben werden.
+<note important>Achtung! Auch der Name der Variable muss richtext enthalten und Bootstrap muss mit geladen werden (data-bootstrap="true" im <form> mitgeben).</note>
+<code html>
+<textarea class="richtext" id="richtext_name_der_variable"></textarea>
+ </code>
+{{ :software:tim:actionhandler:chrome.png?300 |:software:tim:datepicker.png}}
+----
 ===Datepicker (Kalender)===
@@ Zeile 364: / Zeile 380: @@
 ----

TIM Wiki / NEW TIM 6 Documentation

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Unterschiede

Seiten-Werkzeuge