JavaScript

1. Allgemeines

Allgemeine Informationen zum Thema "Scripting" finden Sie hier.

2. Bibliotheken




Im JavaScript-Editor haben Sie im Bereich Bibliotheken Zugriff auf die Intrexx Bibliothek für mobile Endgeräte und die Intrexx-Standardbibliothek. Wenn Sie einen Eintrag in einer der Bibliotheken markiert haben, finden Sie unten rechts die folgenden Schaltflächen:

Beschreibung anzeigen
Hier finden Sie eine Beschreibung der aktuell ausgewählten Funktion mit Beispiel-Skript.

Link öffnen
Verlinkt auf entsprechende Seiten mit weiterführenden Informationen.

3. Intrexx Bibliothek für mobile Endgeräte

3.1. Werte auslesen und schreiben

3.1.1. In Eingabefeld oder Textfeld schreiben

Schreibt einen übergebenen Wert in ein Eingabefeld oder ein Ansichtsfeld.

Beispiel

Browser.setValue(getElement("F28BA7351E3C8F5123880548CFA72B64566A1433"), "Some text");

Snippet

Browser.setValue(oHtml, strValue);

3.1.2. Eingabefeld oder Ansichtsfeld auslesen

Wert aus einem Eingabefeld oder Ansichtsfeld auslesen.

Beispiel

Browser.getValue(getElement("F28BA7351E3C8F5123880548CFA72B64566A1433"));

Snippet

Browser.getValue(oHtml);

3.2. Ajax

3.2.1. Javascript-Datei nachladen

Lädt eine Javascriptdatei anhand ihres Pfades nach.
Loader.loadJsFileOnDemand(strFileName)

4. Intrexx-Standardbibliothek

4.1. Ajax

4.1.1. UserWorkflowEvent triggern

Triggert einen UserWorkflowEvent, um damit einen Prozess auszulösen. Parameter: Die GUID des UserWorkflowEvents.
triggerUserWorkflowEvent("");

4.1.2. UserWorkflowEvent mit Requestparametern triggern

Triggert einen UserWorkflowEvent mit zusätzlichen Requestparametern, um damit einen Prozess auszulösen.

Parameter 1: Die GUID des UserWorkflowEvents.
Parameter 2: JSON Liste mit Parametern

Beispiel

triggerUserWorkflowEvent("BE2514445AC5C88F74891F9B296C283AC06F366C",  {qs_param: paramValue});

Snippet

triggerUserWorkflowEvent("",  {});

4.1.3. UserWorkflowEvent triggern mit Ergebnisverarbeitung

Triggert einen UserWorkflowEvent, um damit einen Prozess auszulösen und überprüft den Status des Prozessablaufs. Parameter: Die GUID des UserWorkflowEvents.
$.when(triggerUserWorkflowEvent("",  {}))
.done(function()
	{
		alert("done")
	}
)
.fail(function()
	{
		alert("failed")
	}
);
return true;

4.1.4. Velocity-Datei aufrufen und XML erhalten (Portal)

Form einer Seite an den Server schicken, XML aus einer VM-Datei zurück an den Browser senden und in ein statisches Textfeld schreiben.
var el = getElement("GUID_STATIC_TEXTFIELD");
ajaxVTL("internal/system/vm/custom/.vm", {
    dataType: 'xml',
    data: {
        fr_param1: Browser.getValue(getElement("GUID_FORM_FIELD"))
    },
    success: function (data) {
        Browser.setValue(el, data);
    },
    ixWaitAnim: {
        element: el,
        type: "overlay"
    }
});

4.1.5. Velocity-Datei aufrufen und Text erhalten (Applikation)

Formulardaten senden und in ein statisches Textfeld schreiben. In der VM-Datei (aus dem Applikationspaket) kann der Formularwert aus diesem Beispiel über $Request.get("fr_param1") ausgelesen werden.
var el = getElement("GUID_STATIC_TEXTFIELD");
ajaxAppVTL(".vm", {
    dataType: 'text',
    data: {
        fr_param1: Browser.getValue(getElement("GUID_FORM_FIELD"))
    },
    success: function (data) {
        Browser.setValue(el, data);
    },
    ixWaitAnim: {
        element: el,
        type: "overlay"
    }
}, el);

4.1.6. Velocity-Datei aufrufen und JSON erhalten (Applikation)

Erzeugen einer eigenen JSON-Response innerhalb einer VM-Datei (aus dem Applikationspaket) und an den Browser senden.
var el = getElement("GUID_FROM_ANY_CONTROL");
ajaxAppVTL(".vm", {
    dataType: 'json',
    success: function (data) {
        alert(data.myJSONAnswer);
    },
    ixWaitAnim: {
        element: el,
        type: "overlay"
    }
}, el);


4.1.7. Groovy-Datei aufrufen und JSON erhalten (Portal)

Ruft eine portalweit gültige Groovy-Datei mit Ajax auf und sendet die Antwort an den Browser zurück.
// Path to Groovy file
ix.ajax().requestGroovy('groovy/.groovy', {
    dataType: "json",
    data: {
        "param_a": "1",
        "param_b": "2"
    },
    success: function (data) {
        alert(data);
    }
});

4.1.8. Groovy-Datei aufrufen und JSON erhalten (Applikation)

Ruft eine anwendungsspezifische Groovy-Datei mit Ajax auf und sendet die Response an den Browser zurück.
var el = getElement("GUID_FROM_ANY_CONTROL");
ix.ajax().requestAppGroovy("file.groovy", {
    dataType: "json",
    data: {
        "param_a": "1",
        "param_b": "2"
    },
    success: function (data) {
        alert(data);
    },
    ixWaitAnim: {
        element: el,
        type: "overlay"
    }
}, el);

4.2. Berechnung

4.2.1. Einfache arithmetische Berechnungen

Berechnet das Ergebnis zweier Werte aus HTML-Kontrollen mit Hilfe eines Operators und schreibt das Ergebnis in eine HTML-Kontrolle.

Beispiel

calculate(getElement("F28BA7351E3C8F5123880548CFA72B64566A1421"), getElement("80467069EA61BD786CFFEB508786723D6451F2F5"),
"+", getElement("B52A9E9FC555A820984E63DECF13BCAA33E308CD"));

Snippet

calculate(oHtmlNumber1, oHtmlNumber2, strOperator, oHtmlResult);

4.2.2. Zeitdauer berechnen

Berechnet die Dauer der beiden übergebenen Werte aus HTML-Kontrollen mit dem Typ "Datum & Zeit" und liefert sie als formatierten String der Form "2 Tage 3 Minuten" zurück.

Beispiel

getLocalDurationString(getElement("4E48F310711C446B4B04752A6B3239900D49F3A0"),getElement("E13A41C114E8754574DEA9767F505DDE3491C89A"));

Snippet

getLocalDurationString(oHtmlDate1, oHtmlDate2);

4.3. Notifier

4.3.1. Einfache Statusmeldung

Zeigt eine einfache Statusmeldung in der unteren rechten Ecke des Browsers an. Alternativ kann statt "notify" auch "warn" oder "error" verwendet werden.
Notifier.status.notify("Einstellungen wurden übernommen.");

4.3.2. Meldung an einem HTML-Element ausgerichtet anzeigen

Zeigt eine einfache Statusmeldung unterhalb eines HTML-Elements an (an der linken unteren Ecke ausgerichtet). Alternativ kann statt "notify" auch "error" verwendet werden.
Notifier.element.notify(getElement(), "EXAMPLE_TEXT");

4.4. Schaltflächen

4.4.1. Ganztägigen Termin setzen

Setzt 2 Datenfelder vom Typ Datum auf die Dauer eines ganzen Tages: datumVon 00:00 Uhr, datumBis 00:00 Uhr des nächsten Tages.

Beispiel

Ausführbar im onclick()-Event einer Checkbox):
setFullDays(getElement("123401F1E55C9A193BE6EC4091B45C6A5A6C8154"), getElement("DD2E01F1E55C9A193BE6EC4091B45C6A5A6C8154"),
getElement("4D0708BDECC7D088613F818CE1B09B8D812F5750") );

Snippet

setFullDays(oHtmlCheckbox, oHtmlDateFrom, oHtmlDateTo);

4.5. Tabellen

4.5.1. Zeilen und Spalten einfärben (Zahlenwerte)

Färbt Zeilen und Zellen einer Ansichtstabelle in Abhängigkeit eines Zahlenwertes ein. Die Farbe kann hexadezimal oder als Name angegeben werden. Eingefärbt werden kann "row" = ganze Zeile (tr), "cell" = ganze Zelle (td), "span" = Text der Zelle (span).

Beispiel

Färbt alle Zeilen, die im Feld viewcontrolD54BA2DD einen Wert größer als 10 besitzen):
inking("viewcontrolD54BA2DD", ">", 10, "#008000", "row");

Snippet

inking(strControlName, strOperator, compareValue, strColor, colored);

4.5.2. Zeilen und Spalten einfärben (Datumswerte)

Färbt Zeilen und Zellen einer Ansichtstabelle in Abhängigkeit des aktuellen Datumswerts ein. Mögliche Vergleichswerte sind aktuelles Datum ("date") oder aktuelles Datum und aktuelle Zeit ("datetime"). Die Farbe kann hexadezimal oder als Name angegeben werden. Eingefärbt werden kann "row" = ganze Zeile (tr), "cell" = ganze Zelle (td), "span" = Text der Zelle (span).

Beispiel

Färbt alle Zeilen, die im Feld viewcontrolD54BA2DD ein Datum haben, das kleiner ist als das aktuelle Datum:
inkingDate("viewcontrolD54BA2DD", "<", "date", "#008000", "row");

Snippet

inkingDate(strControlName, strOperator, dateType, strColor, colored);

4.5.3. Zeilen und Spalten einfärben (Strings)

Färbt Zeilen und Zellen einer Ansichtstabelle in Abhängigkeit eines Stringvergleichs. Die Farbe kann hexadezimal oder als Name angegeben werden. Eingefärbt werden kann "row" = ganze Zeile (tr), "cell" = ganze Zelle (td), "span" = Text der Zelle (span)

Beispiel

Färbt alle Zeilen, die im Feld viewcontrolD54BA2DD den Status "erledigt" besitzen:
inkingString("viewcontrolD54BA2DD", "==", "erledigt", "#008000", "row");

Snippet

inkingString(strControlName, strOperator, strValue, strColor, colored);

4.5.4. Zeile abfragen

Liefert den Elternknoten (die Zeile) des übergebenen Knotens.
getRow(node)

4.5.5. Spalte abfragen

Liefert den Elternknoten (die Spalte) des übergebenen Knotens.
getCol(node)

4.6. Werte auslesen und schreiben

4.6.1. In Ansichtsfeld / Textfeld schreiben (mit ID)

Schreibt einen übergebenen Wert in ein Ansichtsfeld oder ein statisches Textfeld, das mit Hilfe von dessen DOM-ID (Attribut "ID" des HTMl-Elements) referenziert wird.

Beispiel

setTextValueById("ID_labelcontrol900CB1AB", "Some text");

Snippet

setTextValueById(strHtmlId, strValue);

4.6.2. In Ansichtsfeld / Textfeld schreiben

Schreibt einen übergebenen Wert in ein Ansichtsfeld oder ein statisches Textfeld.

Beispiel

Browser.setValue(getElement("F28BA7351E3C8F5123880548CFA72B64566A1433"), "Some text");

Snippet

Browser.setValue(oHtml, strValue);

4.6.3. Ansichtsfeld / Textfeld auslesen (mit ID)

Wert aus einem Ansichtsfeld oder einem statischen Textfeld mit Hilfe der DOM ID auslesen.

Beispiel

getTextValueById("ID_labelcontrol900CB1AB");

Snippet

getTextValueById(strHtmlId);

4.6.4. Ansichtsfeld / Textfeld auslesen

Wert aus einem Ansichtsfeld oder einem statischen Textfeld auslesen.

Beispiel

Browser.getValue(getElement("F28BA7351E3C8F5123880548CFA72B64566A1433"));

Snippet

Browser.getValue(oHtml);

4.6.5. Text in Zwischenablage kopieren

Sendet einen Text an die Zwischenablage. Sollte diese Funktion aus Sicherheitsgründen deaktiviert sein, wird statt dessen ein Tooltip mit dem zu kopierenden Text angezeigt. Übergabeparameter:

param1:
Text oder eine Aktionskontrolle. Im Falle einer Kontrolle wird aus dieser der URL des Sprungziels in die Zwischenablage kopiert.

param2:
Optionaler Parameter als Liste mit folgenden möglichen Übergabeparametern:
strMsgTitle - Titel der Rückmeldung an den Benutzer
strMsgBody - Text der Rückmeldung an den Benutzer, wenn der Text erfolgreich in die Zwischenablage kopiert werden konnte
bFallback - true (Default) oder false. Falls der Text nicht in die Zwischenablage kopiert werden konnte, so wird im Falle von bFallback=true der Text in einem Tooltip angezeigt.
iTextHeight - Zeilenhöhe innherhalb der Tooltips (Default: 1)
iTextWidth - Breite des Tooltips (Default: 50)
strTextStyles - CSS-Styles für das Tooltip

Beispiel

Helper.sendToClipboard("Hallo Welt!", {strMsgTitle: "Clipboard", strMsgBody: "Text copied to clipboard", bFallback: true, iTextHeight:1, iTextWidth:50};
Helper.sendToClipboard(getElement("56C159AEECD062FC3B273F0E999A67FA842D3FB8").oUp);

Snippet

Helper.sendToClipboard(param1, param2);

4.7. Werte formatieren

4.7.1. Float aus lokal formatiertem String

Parst einen lokal formatierten String zu einem Float (Number-Objekt).

Beispiel

getFloatByLocalString("1.234");

Snippet

getFloatByLocalString(strValue);

4.7.2. Float-String aus lokal formatiertem String

Parst einen lokal formatierten String zu einem String im Floatformat (z.B. 1.234,56 -> 1234.56).

Beispiel

getFloatStringByLocal("1.234,56");

Snippet

getFloatStringByLocal(strValue);

4.7.3. Integer aus lokal formatiertem String

Parst einen lokal formatierten String zu einem Integer (Number-Objekt).

Beispiel

getIntegerByLocalString("1.234");

Snippet

getIntegerByLocalString(strValue);

4.7.4. Integer-String aus lokal formatiertem String

Parst einen lokal formatierten String zu einem String im Integerformat (z.B. 1.234 -> 1234).

Beispiel

getIntegerStringByLocal("1.234");

Snippet

getIntegerStringByLocal(strValue);

4.7.5. JavaScript-Datum aus HTML-Kontrolle

Erzeugt aus einer HTML-Kontrolle vom Typ "date", "time" oder "date & time" ein JavaScript Datumsobjekt.

Beispiel

getDateObject(getElement("A84E5E7F9EA9ED1A829DB98DBF5459F59961FA3B"));

Snippet

getDateObject(oHtml);

4.7.6. JavaScript-Zahl aus HTML-Kontrolle

Erzeugt aus einer HTML-Kontrolle vom Typ "integer", "float" oder "currency" ein JavaScript-Zahlenobjekt.

Beispiel

getNumberObject(getElement("5F7S5E7F9EA9ED1A829DB98DBF5459F59961FA3B"));

Snippet

getNumberObject(oHtml);

4.7.7. Lokal formatierter String aus Number-/Datumsstring

Erzeugt einen lokal formatierten String aus einem Number- oder aus einem Datumsstring. Mit dem Parameter "oHtml" wird eine Referenz auf eine Eingabekontrolle mit Typ "integer", "float", "currency" oder "datetime" erstellt. Damit werden Typen- und Formatierungsvorgaben des Wertes definiert. "strValue" definiert den zu formatierenden Wert.

Beispiel

toLocalString(getElement("DDB279D4974A17DB27A89F58DB36F7BF4E10DA13"),"123.45");

Snippet

toLocalString(oHtml, strValue);

4.7.6. String formatieren und in Kontrolle schreiben

Erzeugt einen lokal formatierten String aus einem Number- oder aus einem Datumsstring und schreibt das Ergebnis in eine HTML-Eingabekontrolle.

toLocalString(oHtml, strValue)
oHtml - Referenz auf eine Eingabekontrolle mit Typ "integer", "float", "currency" oder "datetime". Damit werden Typen- und Formatierungsvorgaben des Wertes definiert. Das Ergebnis wird in diese Kontrolle geschrieben. strValue - zu formatierender Wert.

Beispiel

writeLocalString(getElement("DDB279D4974A17DB27A89F58DB36F7BF4E10DA13"),"123.45");

Snippet

writeLocalString(oHtml, strValue);

4.7.9. Währung aus lokal formatiertem String

Parst einen lokal formatierten String zu einer Währung (Number-Objekt).

Beispiel

getCurrencyByLocalString("1.234");

Snippet

writeLocalString(oHtml, strValue);

4.7.10. Währungs-String aus lokal formatiertem String

Parst einen lokal formatierten String zu einem String im Währungsformat (z.B. 1.234,56 -> 1234.56).

Beispiel

getCurrencyStringByLocal("1.234,56");

Snippet

getCurrencyStringByLocal(strValue);

4.8. WebSockets

Die JavaScript-Methoden im Zusammenhang mit WebSockets bieten die Möglichkeit Nachrichten (Topics) zu subskribieren und das Subskribieren wieder zu beenden.

ix.websocket

4.8.1 Subskribieren eines Topics starten

Hinweis: Beachten Sie, dass die folgenden Beispiele nicht für den IE11 ausgelegt sind.

Beispiel 1

const mySubscriber = await ix.websocket.subscribeToTopic("D00F000000000000000000000000000000000000", {
   onmessage: (data) => {
      console.log(data);
   }
});

Beispiel 2

const mySubscriber = await ix.websocket.subscribeToTopic("D00F000000000000000000000000000000000000", {
   key: "key1",
   onmessageJSON: (data) => {
      console.log(data);
   },
   onerror: (error) => {
      console.log(error);
   },
   onclose: (event) => {
      console.log(event);
   }
});

Snippet

ix.websocket.subscribeToTopic(topic, subscriber [, websocketAlias])
ix.websocket.html#ix.websocket.subscribeToTopic__anchor

4.8.2 Subskribieren eines Topics beenden

Hinweis: Beachten Sie, dass die folgenden Beispiele nicht für den IE11 ausgelegt sind.

Beispiel 1

ix.websocket.unsubscribeFromTopic(mySubscriber)

Beispiel 2

ix.websocket.unsubscribeFromTopic("key1")

Snippet

ix.websocket.unsubscribeFromTopic(subscriber [, websocketAlias])
ix.websocket.unsubscribeFromTopic__anchor

4.9. Eingabe erforderlich

Überprüft die übergebene Eingabekontrolle, als wäre die Option "Eingabe erforderlich" aktiviert oder überprüft alle Kontrollen einer übergebenen Gruppierung, bei denen die Option "Eingabe erforderlich" gesetzt wurde. Als zweiter Parameter kann optional ein alternativer Text angegeben werden, der im Fehlerfall statt dem voreingestellten Text angezeigt wird.

Beispiel

checkRequired(getElement("E94A9FBDADD46039BB62F76870E1EC57C226C6DC"), "Ein alternativer Text");

Snippet

checkRequired(oHtml,strMessage);

4.10. Datum vergleichen

Vergleicht den Wert einer Datumskontrolle ("date", "time" oder "datetime") mit dem aktuellen Datum. Möglich für Eingabe- und Ansichtskontrollen. Bei Ansichtskontrollen muss das Expertattribut jsobject = true (Boolean) gesetzt werden.

Beispiel

dateComparedToNow(getElement("5F7S5E7F9EA9ED1A829DB98DBF5459F59961FA3B"));
Mögliche Rückgabewerte:
-1, wenn ein Fehler aufgetreten ist oder die übergebene Kontrolle leer ist.
0, wenn das Datum kleiner als das aktuelle Datum ist.
1, wenn das Datum gleich dem aktuellen Datum ist.
2, wenn das Datum größer als das aktuelle Datum ist.

Snippet

dateComparedToNow(oHtmlDate);

4.11. Zeitintervall addieren / subtrahieren

Addiert oder subtrahiert einen Zeitanteil zu/von einem übergebenen JavaScript Datumsobjekt. Mögliche Parameter:
"ms" - Millisekunden / "s" - Sekunden / "mi" - Minuten / "h" - Stunden / "d" - Tage / "mo" - Monate / "y" - Jahre

Beispiel

var dtNow = new Date();
var dtAdd1 = dateAdd("d", 1, dtNow); // addiert 1 Tag auf das aktuelle Datum
var dtAdd2 = dateAdd("h", -2, dtNow); // subtrahiert 2 Stunden vom aktuellen Datum

Snippet

dateAdd(typeOfInterval, intValue, oHtmlDate);

4.12. Seite einer Applikation öffnen

Führt eine Applikationsrequest aus und öffnet eine Seite einer Applikation in einem neuen Fenster.

Beispiel

makeAppRequest("5C9AA563556C7A98CD03AAFAE9E93EC13B6EBB07", "8875BAC49802DC90A9FE41F5114D8F1E28036891", "1", false, false, false);

Snippet

makeAppRequest(strApplicationGuid, strPageGuid, strRecId, false, false, true);

4.13. JavaScript-Komprimierung ausschalten

Durch Einfügen dieses Kommentars kann die Minifizierung der JavaScript-Dateien z.B. zu Debugging-Zwecken deaktiviert werden.
// compress = false

4.14. Zugriff auf Sprachkonstanten

Beispiel 1

Zugriff auf globale Sprachkonstanten:
ix.text.i18n.get('WIDTH')

Beispiel 2

Zugriff auf Sprachkonstanten aus Applikationen:
ix.text.i18n.getByApp('AB4B031834F042FCADB595DF1923B768C7773F00', 'SHARE_FEED_MORE_COMMENTS')

Snippet

ix.text.i18n