Hierarchy

  • JQuery

Index

Methods

addStar

  • Fügt einen (standardmäßig kleinen roten) Stern an den Leittext eines Formularfelds. Dieser Stern gibt an, ob das Formularfeld ein Mussfeld is.

    Derzeit wird hierzu ein SPAN-Element mit der Klasse required-star erzeugt, dies kann sich ändern:

    <span class="required-star">*</span>

    Zum Beispiel:

    // Adds a star to the label of the form field tf1.
    $('input[name="tf1"]').addStar();

    Diese Funktion ändert nur das das Aussehen, aber nicht, ob das Formularfeld ein Mussfeld ist. Um festzulegen, ob ein Feld Mussfeld ist, kann die Funktion setRequired verwendet werden.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

appointmentPicker

  • Initializes a date and time picker for selecting an appointment. Appointments can be configured in the backend. Lets the user select a date (year, month, day) and a time (hour and minute).

    Parameters

    • Optional method: "init"

    Returns JQuery

    this for chaining.

  • Retrieves the currently selected slot for the first element in the current selection.

    Parameters

    • method: "getSlot"

      The method to invoke on the appointment picker.

    Returns Promise<IAppointmentSlot | undefined>

    The currently selected slot, or undefined when no slot is selected. The promise is rejected when the current selection is empty.

  • Ruft den aktuell ausgewählten Slot für das erste Element in der aktuellen Auswahl ab, und zwar auf synchrone Weise, d. h. durch direkte Rückgabe des Slots anstelle eines Versprechens. Aus Gründen der Konsistenz geben alle Methoden Versprechen zurück. Verwenden Sie diese Methode nur, wenn Sie synchron auf den Slot zugreifen müssen, z. B. bei der Arbeit mit APIs, die keine asynchronen Rückrufe unterstützen.

    throws

    Wenn die aktuelle Auswahl leer ist oder keinen Terminwähler enthält.

    Parameters

    • method: "getSlotSync"

      Die Methode, die für die Terminauswahl aufgerufen werden soll.

    Returns IAppointmentSlot | undefined

    Der aktuell ausgewählte Slot oder undefined, wenn kein Slot ausgewählt ist.

  • Fetches all available slots of a given month and year for the first element in the selection.

    Parameters

    • method: "getSlots"

      The method to invoke on the appointment picker.

    • Optional monthYear: Partial<IAppointmentLocalMonthYear>

      The month and year for which to fetch the slots. When a property is not given, it defaults to the currently selected month and year.

    Returns Promise<IAppointmentMonthSlotData>

    All available slots for the given month and year. The promise is rejected when the slots could not be fetched from the server.

  • Finds the currently selected month and the corresponding year of the first element in the current selection.

    Parameters

    • method: "getMonthYear"

      The method to invoke on the appointment picker.

    Returns Promise<IAppointmentLocalMonthYear | undefined>

    The currently selected month and year, or undefined when no month or year is selected. The promise is rejected when the current selection is empty

  • Selects a particular month in a given year and shows all days for the month for all elements in the current selection. When the date picker is closeable, you should open it first.

    Parameters

    • method: "setMonthYearDelta"

      The method to invoke on the appointment picker.

    • Optional monthYearDelta: Partial<IAppointmentLocalMonthYear>

      The month and year to select, relative to the currently selected month and year. The month defaults to 1 and the year to 0 (e.g. move to the next month). Can be negative.

    Returns Promise<IAppointmentMonthSlotData[]>

    All available slots for the selected month in the given year. The array contains one entry for each element in the current selection. The promise resolves when all month and years were set (or rejects when one could not be set).

  • Selects a particular month in a given year and shows all days for the month for all elements in the current selection. When the date picker is closeable, you should open it first.

    Parameters

    • method: "setMonthYear"

      The method to invoke on the appointment picker.

    • Optional monthYear: Partial<IAppointmentLocalMonthYear>

      Day to select. When a property is not given, it defaults to the currently selected month or year.

    Returns Promise<IAppointmentMonthSlotData[]>

    All available slots for the selected month in the given year. The array contains one entry for each element in the current selection. The promise resolves when all month and years were set (or rejects when one could not be set).

  • Selects a particular day and shows the available slots of that day for all elements in the current selection.

    Parameters

    • method: "setDate"

      The method to invoke on the appointment picker.

    • date: Partial<IAppointmentLocalDate>

      Day to select. When a property is not given, it defaults to the currently selected date.

    Returns Promise<IAppointmentDaySlotData[]>

    All available slots for the selected day. The array contains one entry for each element in the current selection. The promise resolves when all dates were set (and rejects when a date could not be set).

  • Changes the currently selected slot to the given slot or clears the selected slot, for all elements in the current selection.

    // Selects the first slot of the current month, if any
    async function selectFirstSlot(app) {
      const {slots} = await app.appointmentPicker("getSlots");
      const firstSlot = Object.values(slots)?.[0]?.slots?.[0]?.slot;
      if (firstSlot) {
        await app.appointmentPicker("setSlot", firstSlot);
      }
    }
    selectFirstSlot($("[name='app1']"));

    Parameters

    • method: "setSlot"

      The method to invoke on the appointment picker.

    • Optional slot: IAppointmentSlot

      The slot to set, or undefined to clear the selected slot.

    • Optional options: IAppointmentSetSlotOptions

      Optional settings affecting how the slot is set.

    Returns Promise<void>

    A promise that resolves when the slots were set, or rejects when the slots could not be set.

  • Closes or opens the appointment picker for all elements in the current selection.

    Parameters

    • method: "toggle"

      The method to invoke on the appointment picker.

    • Optional open: boolean

      true to open the picker, false to close it, undefined to open it when closed and vice versa.

    Returns Promise<boolean[]>

    Whether the picker is now opened. The array contains one entry for each element in the current selection. The promise is resolved when the picker was toggled, and rejected when either the selection is empty or the appointment picker is not closable.

  • Checks whether the appointment picker is opened or closed, for the first element in the current selection.

    Parameters

    • method: "isOpened"

      The method to invoke on the appointment picker.

    Returns Promise<boolean>

    true when the picker is open, or false otherwise. Always returns true when the picker is not closable. The promise is rejected when either the selection is empty.

autoNumeric

  • Initialisiert autoNumeric. Muss aufgerufen werden, bevor die anderen Methoden genutzt werden können. Diese Funktion sollte mit Texteingabefeldern genutzt werden.

    autoNumeric ist eine JavaScript-Bibliothek zur Eingabe von Zahlen in länderspezifischen Formaten. Diese Bibliothek ist bereits in formcycle eingebunden, sodass sie in Formularen direkt genutzt werden kann. Auf der offiziellen Webseite findet sich eine ausführliche Erklärung.

    Zuerst wird ein Eingabefeld mit jQuery selektiert, dann werden die Optionen an autoNumeric wie folgt übergeben:

    $("[name=tfGewicht]").autoNumeric("init", {
      aDec: ',', //Komma als Dezimalseparator
      aSep: '', // kein Trennzeichen für Tausender
      aSign: ' kg', // Einheit kg
      pSign: 's', // Einheit nach der Zahl
      vMin: 1, // Mindestwert 1
      vMax: 100, // Höchstwert 100
      mDec: 3, // Maximal 3 Dezimalstellen
      aPad: false // Es können auch weniger als 3 Dezimalstellen sein.
      // weitere Optionen...
    });

    Im Textfeld tfGewicht kann der Nutzer nun z.B. 3,99 eingeben, dies wird als 3,99 kg angezeigt. autoNumeric stellt sicher, dass es sich um eine gültige Zahl ist.

    Einige oft verwendete Einstellungen sind:

    • aDec: Dezimaltrennzeichen
    • aSep: Trennzeichen für Tausender
    • aSign: Einheit der Zahl, etwa EUR oder ¥.
    • pSign: Ob die Einheit am Ende (Wert s) oder am Anfang (Wert p) steht
    • vMin: Geringster erlaubter Zahlenwert
    • vMax: Größter erlaubter Zahlenwert
    • mDec: Höchstanzahl von Dezimalstellen
    • aPad: Ob immer auf die angegebene Anzahl von Dezimalstellen mit Nullen aufgefüllt wird

    Es sei angemerkt, dass die Optionen statt per JavaScript auch als HTML-Data-Attribute an dem Eingabefeld übergeben werden können:

    <input id="money-field"
        data-a-dec=","
        data-a-sign="kg"
        data-v-min="1"
        data-v-max="100"
        data-m-dec="3"
    >

    Parameters

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Beendet die Formattierung durch autoNumeric.

    Parameters

    • method: "destroy"

      Name der aufzurufenden Methode.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Methode, um den eigentlichen Zahlenwert eines Eingabefeldes zu erhalten, unabhängig der derzeitigen Formattierungseinstellungen.

    Parameters

    • method: "get"

      Name der aufzurufenden Methode.

    Returns string

    Der aktuelle Wert, im Format nnnn.nn mit einem Punkt als Dezimatrennzeichen.

  • Nutzt die Methode serializeArray von jQuery, welche ein Feld mit Objekten zurückliefert und als JSON-String enkodiert werden kann.

    Parameters

    • method: "getArray"

      Name der aufzurufenden Methode.

    Returns object[]

    Die Werte, im Format nnnn.nn mit einem Punkt als Dezimatrennzeichen.

  • Parameters

    • method: "getSettings"

      Name der aufzurufenden Methode.

    Returns InitOptions

    Die aktuellen Einstellungen von autoNumeric. Kann für die Entwicklung nützlich sein.

  • Nutzt die Methode serialize von jQuery, welche aus einer Menge von Formularelementen eine URL-enkodierte Zeichenkette erzeugt, die abgesendet werden kann. Diese Methode sorgt dafür, dass nicht die formattieren Werte genutzt werden, sondern die formatunabhängigen.

    Parameters

    • method: "getString"

      Name der aufzurufenden Methode.

    Returns string

    Die Werte, im Format nnnn.nn mit einem Punkt als Dezimatrennzeichen.

  • Initialisiert autoNumeric. Muss aufgerufen werden, bevor die anderen Methoden genutzt werden können.

    Parameters

    • method: "init"

      Name der aufzurufenden Methode.

    • Optional options: Partial<ValueOrSupplier<InitOptions>>

      Optionale Einstellungen für autoNumeric.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Setzt den Wert des Eingabefelds auf den gegebenen Wert. Der Wert wird anhand der aktuellen Formattierungseinstellungen entsprechend formattiert angezeigt.

    Parameters

    • method: "set"

      Name der aufzurufenden Methode.

    • number: string | number

      Die neue Zahl oder der neue Wert für das Eingabefeld.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Aktualisiert eine oder mehrere Formattierungseinstellungen.

    Parameters

    • method: "update"

      Name der aufzurufenden Methode.

    • options: Partial<ValueOrSupplier<InitOptions>>

      Neue zu setzende Formattierungseinstellungen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

autocompleteDB

  • autocompleteDB(queryName: string, label?: string, onSelect?: function): JQuery
  • autocompleteDB(queryName: string, label: string, value: string, onSelect?: function, params?: SingleOrArrayLike<undefined | boolean | number | string | Node | JQuery>): JQuery
  • Sollte nur auf Texteingabefelder angewendet werden.

    Aktiviert die Autovervollständigung für das Texteingabefeld. Die möglichen Optionen werden aus einer Datenbankabfrage genommen. Dem Nutzer wird während des Tippens eine Liste der in Frage kommenden Optionen angezeigt.

    Die Datenbankabfrage wird asynchron über AJAX ausgeführt. Datenbankabfragen können im Backend von XIMA formcycle konfiguriert werden.

    Der gegebene Datenbankspaltenname wird als Anzeigetext der Option genommen; und auch als der Wert, der beim Absenden des Formulars mitgesendet wird. Diese Funktion beschränkt die Datenbankabfrage auf diese Spalte. Somit wird die Menge der zu übertragenden Daten reduziert. Dies beschleunigt den Vorgang bei großen Datenbanktabellen.

    Die Datenbankabfrage muss genau einen Parameter in Form eines Fragezeichens (?) besitzen. Dieser Parameter wird mit dem Text ersetzt, den der Nutzer bisher in das Eingabefeld eingegeben hat. Es müssen hierbei keine Anführungszeichen oder Maskierungszeichen verwendet werden. Die Datenbankabfrage wird als vorbereitete Anweisung ausgeführt.

    Beispiel Länder

    Angenommen, es wurde im Backend eine Datenbankabfrage mit dem Namen LandNamen angelegt. Die Abfrage könnte etwa wie folgt aussehen:

    SELECT code, de FROM demo.countries where de like concat('%',?,'%');

    Um nun diese Abfrage mit dem Eingabefeld namens tfLand zu nutzen:

    $('[name="tfLand"]').autocompleteDB("LandNamen", "de");

    Wenn der Nutzer nun den Text An eingibt, liefert die Datenbankabfrage alle Länder zurück, die mit An beginnen. Diese werden dem Nutzer als mögliche Vorschläge angezeigt: Andorra, Angola, Anguilla, Antarktika, Antigua und Barbuda.

    Beispiel mit Rückruffunktion

    function codeSetzen(event, ui){
      $('[name=tfLandercode]').val(ui.item.code)
    }
    $('[name=tfLander]').autocompleteDB("LandNamen", "de", codeSetzen);

    Wie im oberen Beispiel wird die Autovervollständigung initialisert. Zusätzlich wird noch bei Auswahl einer Option aus der Länderliste aber noch eine weitere Funktion ausgeführt werden. In dieser Funktion wird nun auf das ausgewählte Element zugegriffen (ui.item) und der Wert der Spalte code ausgelesen (ui.item.code). Dieser Wert entspricht dem Wert aus der Spalte code aus der Datenbankabfrage der Länder. Schließlich wird dieser Ländercode in ein Textfeld mit dem Namen tfLandercode für die weitere Verarbeitung geschrieben.

    Parameters

    • queryName: string

      Name der Datenbankabfrage. Datenbankabfragen können im Backend von XIMA formcycle angelegt werden.

    • Optional label: string

      Name der Datenbankspalte. Rückfallwert is label. Diese wird sowohl zum Anzeigen genutzt als auch als der Wert, der beim Absenden des Formulars übertragen wird.

    • Optional onSelect: function

      Die Rückruffunktion, welche aufgerufen wird, wenn der Nutzer eine vorgeschlagene Option auswählt. Siehe auch die Dokumentation von jQueryUI zu autocomplete.

        • (this: JQuery, event: JQuery.TriggeredEvent, ui: object): void
        • Parameters

          • this: JQuery
          • event: JQuery.TriggeredEvent
          • ui: object
            • item: object
              • optionLabel: string
              • optionValue: string

          Returns void

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Sollte nur auf Texteingabefelder angewendet werden.

    Aktiviert die Autovervollständigung für das Texteingabefeld. Die möglichen Optionen werden aus einer Datenbankabfrage genommen. Dem Nutzer wird während des Tippens eine Liste der in Frage kommenden Optionen angezeigt.

    Die Datenbankabfrage wird asynchron über AJAX ausgeführt. Datenbankabfragen können im Backend von XIMA formcycle konfiguriert werden.

    Es können zwei Datenbankspaltennamen angegeben werden. Die eine Spalte wird als Anzeigetext der Option genommen. Die andere Spalte wird verwendet als der Wert, der beim Absenden des Formulars mitgesendet wird. Diese Funktion beschränkt die Datenbankabfrage auf diese beiden Spalten. Somit wird die Menge der zu übertragenden Daten reduziert. Dies beschleunigt den Vorgang bei großen Datenbanktabellen.

    Die Datenbankabfrage muss wenigstens einen Parameter in Form eines Fragezeichens (?) besitzen. Dieser Parameter wird mit dem Text ersetzt, den der Nutzer bisher in das Eingabefeld eingegeben hat. Es müssen hierbei keine Anführungszeichen oder Maskierungszeichen verwendet werden. Die Datenbankabfrage wird als vorbereitete Anweisung ausgeführt. Enthält die Abfrage weitere Parameter, müssen für diese Werte an diese Funktion übergeben werden. Andernfalls schlägt die Abfrage fehl.

    Beispiel Länder

    Angenommen, es wurde im Backend eine Datenbankabfrage mit dem Namen LandNamen angelegt. Die Abfrage könnte etwa wie folgt aussehen:

    SELECT code, de FROM demo.countries where de like concat('%',?,'%');

    Um nun diese Abfrage mit dem Eingabefeld namens tfLand zu nutzen:

    $('[name="tfLand"]').autocompleteDB("LandNamen", "de");

    Wenn der Nutzer nun den Text An eingibt, liefert die Datenbankabfrage alle Länder zurück, die mit An beginnen. Diese werden dem Nutzer als mögliche Vorschläge angezeigt: Andorra, Angola, Anguilla, Antarktika, Antigua und Barbuda.

    Beispiel mit Rückruffunktion

    function codeSetzen(event, ui){
      $('[name=tfLandercode]').val(ui.item.code)
    }
    $('[name=tfLander]').autocompleteDB("LandNamen", "de", codeSetzen);

    Wie im oberen Beispiel wird die Autovervollständigung initialisert. Zusätzlich wird noch bei Auswahl einer Option aus der Länderliste aber noch eine weitere Funktion ausgeführt werden. In dieser Funktion wird nun auf das ausgewählte Element zugegriffen (ui.item) und der Wert der Spalte code ausgelesen (ui.item.code). Dieser Wert entspricht dem Wert aus der Spalte code aus der Datenbankabfrage der Länder. Schließlich wird dieser Ländercode in ein Textfeld mit dem Namen tfLandercode für die weitere Verarbeitung geschrieben.

    Parameters

    • queryName: string

      Name der Datenbankabfrage. Datenbankabfragen können im Backend von XIMA formcycle angelegt werden.

    • label: string

      Name der Datenbankspalte, die als Text genutzt wird, der dem Nutzer angezeigt wird.

    • value: string

      Name der Datenbankspalte, die als Wert genutzt wird, der beim Absenden des Formulars übertragen wird.

    • Optional onSelect: function

      Die Rückruffunktion, welche aufgerufen wird, wenn der Nutzer eine vorgeschlagene Option auswählt. Siehe auch die Dokumentation von jQueryUI zu autocomplete.

        • (event: JQuery.TriggeredEvent, ui: object): void
        • Parameters

          • event: JQuery.TriggeredEvent
          • ui: object
            • item: object
              • optionLabel: string
              • optionValue: string
            • this: JQuery

          Returns void

    • Optional params: SingleOrArrayLike<undefined | boolean | number | string | Node | JQuery>

      Weitere Parameter für die Datenbankabfrage. Kann ein einzelner Wert oder ein Feld von Werten sein, es werden alle angegebenen Wert als Parameter übertragen. Bei undefined wird ein leerer Wert übertragen. Bei einem String wird der String selbst übertragen. Bei Zahlen und Wahrheitswerden wird die String-Repräsentation der Zahl beziehungsweise des Wahrheitswerts übertragen. Bei einer JQuery-Instanz werden die Werte aller HTML-Elemente in der JQuery-Selektion übertragen. Bei einem HTMLElement: (1) wenn es ein Checkbox- oder Radio-Input-Element ist, wird der Wert der Checkbox oder des Radiobuttons übertragen, falls selektiert, (2) wenn es ein File-Input-Element ist, werden die Namen aller Dateien übertragen oder der leere String, falls keine Datei ausgewählt ist, (3) bei anderen Input-Elementen wird der Wert des Input-Elements übertragen, (4) wenn es ein Select- oder Textarea-Element ist, wird der Wert via $.fn.val ermittelt und übertragen, (5) bei anderen Elementen wird nach Kinderelementen vom Type input, textarea und select gesucht und deren Werte übertragen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

autocompleteLDAP

  • autocompleteLDAP(queryName: string, label?: string, onSelect?: function): JQuery
  • autocompleteLDAP(queryName: string, label: string, value: string, onSelect?: function, params?: SingleOrArrayLike<undefined | boolean | number | bigint | string | Node | JQuery>): JQuery
  • Sollte nur auf Texteingabefelder angewendet werden.

    Aktiviert die Autovervollständigung für das Texteingabefeld. Die möglichen Optionen werden aus einem LDAP (Lightweight Directory Access Protocol) genommen. Dem Nutzer wird während des Tippens eine Liste der in Frage kommenden Optionen angezeigt.

    Die LDAP-Abfrage wird asynchron über AJAX ausgeführt. LDAP-Abfrage können im Backend von XIMA formcycle konfiguriert werden.

    Die gegebene LDAP-Eigenschaft wird als Anzeigetext der Option genommen; und auch als der Wert, der beim Absenden des Formulars mitgesendet wird. Diese Funktion beschränkt die LDAP-Abfrage auf diese Eigenschaft. Somit wird die Menge der zu übertragenden Daten reduziert und der Vorgang beschleunigt.

    Die LDAP-Abfrage muss genau einen Parameter in Form eines Fragezeichens (?) besitzen. Dieser Parameter wird mit dem Text ersetzt, den der Nutzer bisher in das Eingabefeld eingegeben hat.

    Beispiel

    Angenommen, es wurde im Backend eine LDAP-Abfrage mit dem Namen Angestellte angelegt. Die Abfrage könnte etwa wie folgt aussehen:

    BaseDN: ou="employees", ou="company", dc="company", dc="com"
    Query : (userPrincipalName=*?*)

    Um nun diese Abfrage mit dem Eingabefeld namens tfAngestellte zu nutzen:

    $('[name="tfAngestellte"]').autocompleteLDAP("Angestellte", "name.full");

    Wenn der Nutzer nun den Text Peter eingibt, liefert die LDAP-Abfrage alle Angestellten zurück, deren Name Peter enthält. Diese werden dem Nutzer als mögliche Vorschläge angezeigt: Peter Müller, Peter Schmidt, Peter Fischer, Peter Weber.

    Parameters

    • queryName: string

      Name der LDAP-Abfrage. LDAP-Abfragen können im Backend von XIMA formcycle angelegt werden.

    • Optional label: string

      Name eines LDAP-Attributs. Rückfallwert is label. Dieses wird sowohl zum Anzeigen genutzt als auch als der Wert, der beim Absenden des Formulars übertragen wird. Um eine verschachtelte Eigenschaft anzugeben, werden die Bestandteile mit einem Punkt getrennt, z.B.: name.full oder location.city.

    • Optional onSelect: function

      Die Rückruffunktion, welche aufgerufen wird, wenn der Nutzer eine vorgeschlagene Option auswählt. Siehe auch die Dokumentation von jQueryUI zu autocomplete.

        • (this: JQuery, event: JQuery.TriggeredEvent, ui: object): void
        • Parameters

          • this: JQuery
          • event: JQuery.TriggeredEvent
          • ui: object
            • item: object
              • optionLabel: string
              • optionValue: string

          Returns void

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Sollte nur auf Texteingabefelder angewendet werden.

    Aktiviert die Autovervollständigung für das Texteingabefeld. Die möglichen Optionen werden aus einem LDAP (Lightweight Directory Access Protocol) genommen. Dem Nutzer wird während des Tippens eine Liste der in Frage kommenden Optionen angezeigt.

    Die LDAP-Abfrage wird asynchron über AJAX ausgeführt. LDAP-Abfrage können im Backend von XIMA formcycle konfiguriert werden.

    Es können zwei LDAP-Eigenschaften angegeben werden. Die eine Eigenschaft wird als Anzeigetext der Option genommen. Die andere Eigenschaft wird verwendet als der Wert, der beim Absenden des Formulars mitgesendet wird. Diese Funktion beschränkt die Datenbankabfrage auf diese beiden Eigenschaften. Somit wird die Menge der zu übertragenden Daten reduziert. Dies beschleunigt den Vorgang bei großen Datenbanktabellen.

    Die LDAP-Abfrage muss wenigstens einen Parameter in Form eines Fragezeichens (?) besitzen. Dieser Parameter wird mit dem Text ersetzt, den der Nutzer bisher in das Eingabefeld eingegeben hat. Enthält die Abfrage weitere Parameter, müssen für diese Werte an diese Funktion übergeben werden. Andernfalls schlägt die Abfrage fehl.

    Beispiel

    Angenommen, es wurde im Backend eine LDAP-Abfrage mit dem Namen Angestellte angelegt. Die Abfrage könnte etwa wie folgt aussehen:

    BaseDN: ou="employees", ou="company", dc="company", dc="com"
    Query : (userPrincipalName=*?*)

    Um nun diese Abfrage mit dem Eingabefeld namens tfAngestellte zu nutzen:

    $('[name="tfAngestellte"]').autocompleteLDAP("Angestellte", "name.full", "accountName");

    Wenn der Nutzer nun den Text Peter eingibt, liefert die LDAP-Abfrage alle Angestellten zurück, deren Name Peter enthält. Diese werden dem Nutzer als mögliche Vorschläge angezeigt: Peter Müller, Peter Schmidt, Peter Fischer, Peter Weber. Angezeigt werden dem Nutzer Vor- und Nachname der Angestellten, beim Absenden wird der Name des jeweiligen Nutzerkontos übertragen.

    Parameters

    • queryName: string

      Name der LDAP-Abfrage. LDAP-Abfragen können im Backend von XIMA formcycle angelegt werden.

    • label: string

      Name eines LDAP-Attributs, dessen Wert dem Nutzer angezeigt wird. Um eine verschachtelte Eigenschaft anzugeben, werden die Bestandteile mit einem Punkt getrennt, z.B.: name.full oder location.city.

    • value: string

      Name eines LDAP-Attributs, dessen Wert beim Absenden des Formulars übertragen wird. Um eine verschachtelte Eigenschaft anzugeben, werden die Bestandteile mit einem Punkt getrennt, z.B.: name.full oder location.city.

    • Optional onSelect: function

      Die Rückruffunktion, welche aufgerufen wird, wenn der Nutzer eine vorgeschlagene Option auswählt. Siehe auch die Dokumentation von jQueryUI zu autocomplete.

        • (this: JQuery, event: JQuery.TriggeredEvent, ui: object): void
        • Parameters

          • this: JQuery
          • event: JQuery.TriggeredEvent
          • ui: object
            • item: object
              • optionLabel: string
              • optionValue: string

          Returns void

    • Optional params: SingleOrArrayLike<undefined | boolean | number | bigint | string | Node | JQuery>

      Weitere Parameter für die LDAP-Abfrage. Kann ein einzelner Wert oder ein Feld von Werten sein, es werden alle angegebenen Wert als Parameter übertragen. Bei undefined wird ein leerer Wert übertragen. Bei einem String wird der String selbst übertragen. Bei Zahlen und Wahrheitswerden wird die String-Repräsentation der Zahl beziehungsweise des Wahrheitswerts übertragen. Bei einer JQuery-Instanz werden die Werte aller HTML-Elemente in der JQuery-Selektion übertragen. Bei einem HTMLElement: (1) wenn es ein Checkbox- oder Radio-Input-Element ist, wird der Wert der Checkbox oder des Radiobuttons übertragen, falls selektiert, (2) wenn es ein File-Input-Element ist, werden die Namen aller Dateien übertragen oder der leere String, falls keine Datei ausgewählt ist, (3) bei anderen Input-Elementen wird der Wert des Input-Elements übertragen, (4) wenn es ein Select- oder Textarea-Element ist, wird der Wert via $.fn.val ermittelt und übertragen, (5) bei anderen Elementen wird nach Kinderelementen vom Type input, textarea und select gesucht und deren Werte übertragen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

autocompleteQuery

  • autocompleteQuery(url: string, queryName: string, label: string, onSelect?: function): JQuery
  • autocompleteQuery(url: string, queryName: string, label: string, value: string, onSelect?: function, params?: SingleOrArrayLike<undefined | boolean | number | bigint | string | Node | JQuery>): JQuery
  • Sollte nur auf Texteingabefelder angewendet werden.

    Aktiviert die Autovervollständigung für das Texteingabefeld. Die möglichen Optionen werden aus dem Resultat einer HTTP-Abfrage genommen. Dem Nutzer wird während des Tippens eine Liste der in Frage kommenden Optionen angezeigt.

    Dieser Methode erlaubt es, eine eigene URL anzugeben. Zum Ausführen von Datenbank- und LDAP-Abfragen, die im Backend von XIMA formcycle erstellt wurden, sollte JQuery.autocompleteDB beziehungsweise JQuery.autocompleteLDAP verwendet werden.

    see

    JQuery.autocompleteDB

    see

    JQuery.autocompleteLDAP

    Parameters

    • url: string

      URL, die für die Abfrage verwendet werden soll. Normalerweise sollten hierfür die URLs aus XFC_METADATA.urls verwendet werden, beispielsweise XFC_METADATA.urls.dataquery_ldap oder XFC_METADATA.urls.dataquery_db.

    • queryName: string

      Name der Abfrage. LDAP und Datenbankabfrage können im Backend von XIMA formcycle erstellt werden.

    • label: string

      Name eines Felds für das Label und den Wert, wie etwa eine Datenbankspalte oder ein LDAP-Attribut. Rückfallwert is label. Dieses wird sowohl zum Anzeigen genutzt als als der Wert, der beim Absenden des Formulars übertragen wird.

    • Optional onSelect: function

      Die Rückruffunktion, welche aufgerufen wird, wenn der Nutzer eine vorgeschlagene Option auswählt. Siehe auch die Dokumentation von jQueryUI zu autocomplete.

        • (this: JQuery, event: JQuery.TriggeredEvent, ui: object): void
        • Parameters

          • this: JQuery
          • event: JQuery.TriggeredEvent
          • ui: object
            • item: object
              • optionLabel: string
              • optionValue: string

          Returns void

    Returns JQuery

  • Sollte nur auf Texteingabefelder angewendet werden.

    Aktiviert die Autovervollständigung für das Texteingabefeld. Die möglichen Optionen werden aus dem Resultat einer HTTP-Abfrage genommen. Dem Nutzer wird während des Tippens eine Liste der in Frage kommenden Optionen angezeigt.

    Dieser Methode erlaubt es, eine eigene URL anzugeben. Zum Ausführen von Datenbank- und LDAP-Abfragen, die im Backend von XIMA formcycle erstellt wurden, sollte JQuery.autocompleteDB beziehungsweise JQuery.autocompleteLDAP verwendet werden.

    see

    JQuery.autocompleteDB

    see

    JQuery.autocompleteLDAP

    Parameters

    • url: string

      URL, die für die Abfrage verwendet werden soll. Normalerweise sollten hierfür die URLs aus XFC_METADATA.urls verwendet werden, beispielsweise XFC_METADATA.urls.dataquery_ldap oder XFC_METADATA.urls.dataquery_db.

    • queryName: string

      Name der Abfrage. LDAP und Datenbankabfrage können im Backend von XIMA formcycle erstellt werden.

    • label: string

      Name des Felds für den Anzeigetext, wie etwa eine Datenbankspalte oder ein LDAP-Attribut. Dieser Wert wird dem Nutzer als Auswahloption angezeigt.

    • value: string

      Name des Felds für den Wert, wie etwa eine Datenbankspalte oder ein LDAP-Attribut. Der Wert wird beim Absenden des Formulars übertragen.

    • Optional onSelect: function

      Die Rückruffunktion, welche aufgerufen wird, wenn der Nutzer eine vorgeschlagene Option auswählt. Siehe auch die Dokumentation von jQueryUI zu autocomplete.

        • (this: JQuery, event: JQuery.TriggeredEvent, ui: object): void
        • Parameters

          • this: JQuery
          • event: JQuery.TriggeredEvent
          • ui: object
            • item: object
              • optionLabel: string
              • optionValue: string

          Returns void

    • Optional params: SingleOrArrayLike<undefined | boolean | number | bigint | string | Node | JQuery>

      Weitere Parameter für die Abfrage. Kann ein einzelner Wert oder ein Feld von Werten sein, es werden alle angegebenen Wert als Parameter übertragen. Bei undefined wird ein leerer Wert übertragen. Bei einem String wird der String selbst übertragen. Bei Zahlen und Wahrheitswerden wird die String-Repräsentation der Zahl beziehungsweise des Wahrheitswerts übertragen. Bei einer JQuery-Instanz werden die Werte aller HTML-Elemente in der JQuery-Selektion übertragen. Bei einem HTMLElement: (1) wenn es ein Checkbox- oder Radio-Input-Element ist, wird der Wert der Checkbox oder des Radiobuttons übertragen, falls selektiert, (2) wenn es ein File-Input-Element ist, werden die Namen aller Dateien übertragen oder der leere String, falls keine Datei ausgewählt ist, (3) bei anderen Input-Elementen wird der Wert des Input-Elements übertragen, (4) wenn es ein Select- oder Textarea-Element ist, wird der Wert via $.fn.val ermittelt und übertragen, (5) bei anderen Elementen wird nach Kinderelementen vom Type input, textarea und select gesucht und deren Werte übertragen.

    Returns JQuery

clear

  • Löscht den Wert dieses Formularfeldes. Bei Texteingabefeldern wird der Text geleert, bei Auswahlfeldern alle ausgewählten Optionen deselektiert.

    Das Formularfeld wird nach dem Leeren nicht validiert. Falls es sich um ein Mussfeld handelt, wird daher keine Fehlermeldung angzeigt. Die Validierung kann mittels der Funktion validate angestoßen werden.

    // Setzt den Wert des Eingabefelds "tf1" auf "Hallo Welt!"
    // Dies geschieht normalerweise durch den Nutzer
    $('[name="tf1"').val("Hallo Welt!") ;
    
    // Löscht den eingebenen Text
    $('[name="tf1"').clear();
    
    // Validiert das Textfeld. Falls es ein Mussfeld ist, wird nun eine Fehlernachricht angezeigt.
    $('[name="tf1"').validate();

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

cob2auto

  • Diese Funktion kann verwendet werden mit Auswahlfeldern, die als Combobox dargestellt werden.

    Im Designer kann die Autovervollständigung für Auswahlfelder auch direkt über die Oberfläche aktiviert werden. Rechts im Eigenschaftsbereich unter Grundeinstellungen kann dazu die entsprechende Checkbox aktiviert werden.

    Das Auswahlfeld wird in ein Texteingabefeld umgewandelt. Während der Nutzer nun Text eingibt, wird ihm automatisch eine Liste mit in Frage kommenden Möglichkeiten angezeigt. Derzeit wird für diese Funktionalität das jQueryUI-Widget autocomplete verwendet.

    // Wandelt das Auswahlfeld "sel1" in ein Eingabefeld mit Autovervollständigung um.
    $('[name="sel1"]').cob2auto();

    Parameters

    • Optional options: Partial<Cob2AutoOptions>

      Optional Einstellungen für die Autovervollständigung.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

counter

  • Initializes the jQuery counter plugin on an element.

    This jQuery Word and character counter plug-in allows you to count characters or words, up or down. You can set a minimum or maximum goal for the counter to reach.

    deprecated

    Use $.xutil.inputElementCounter instead. A different library is used now.

    Parameters

    • Optional settings: Partial<Settings>

      Optional settings for the plugin.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

dynamic

  • dynamic(options?: Partial<DynamicOptions>): JQuery
  • dynamic(method: "addRow"): JQuery
  • dynamic(method: "removeRow", rowIndex?: number): JQuery
  • dynamic(method: "getRowSize"): number
  • dynamic(method: "setRowSize", rowSize: number): JQuery
  • Schaltet ein Formularelement wiederholbar, sodass der Nutzer nun eine beliebige Anzahl an Kopien anlegen kann. Etwa kann ein E-Mail-Feld wiederholbar geschaltet werden, sodass der Nutzer eine oder mehrere E-Mail-Adressen eingeben kann.

    Um wiederholte erzeugte Elemente zu selektieren, sollte das Attribut org_name statt name verwendet werden.

    // Schaltet Formularfeld "tfMail" wiederholbar
    $("[name="tfMail"").dynamic();
    
    // Zugriff auf den Wert des ersten wiederholten Elements.
    $("[org_name="tfMail"").first().val();

    Jedes einzelne wiederholbare Element befindet sich in einem DIV-Container mit der Klasse dynamic-row. Dieser Container wird an die Rückruffunktionen afterAdd, afterDel, beforeAdd, beforeDel und changeRowSize übergeben.

    Falls Formularfelder über JavaScript initialisiert werden sollen, z.B. mit der Funktion cob2auto oder errorFunc, kann die Initialisierung erst erfolgen, nachdem das Formularfeld wiederholbar erzeugt wurde. Dies kann wie folgt geschehen:

    // Auswahl mit allen Personen wiederholbar schalten
    $('[name="selPersonen"]').dynamic({
      // Rückrüffunktion, wenn ein neues Element erzeugt wurde
      afterAdd: function(_, item) {
        // Das eigentliche Formularelement im DIV-Container selektieren
        var element = item.find('.XItem');
        // Nun kann das Element initialisiert werden, z.B.
        element.cob2auto();
      }
    });

    Elemente können auch direkt im Designer wiederholbar geschaltet werden. Dies geschieht unter den Grundeigeschaften des Eigenschaftsbereichs eines Elements. Dort können auch die Mindestzahl und Höchstzahl wiederholbarer Elemente sowie ein Auslösungselement (trigger) eingestellt werden. Für fortgeschrittene Anwendungsfälle können Elemente über JavaScript mit dieser Method wiederholbar geschaltet werden.

    Parameters

    • Optional options: Partial<DynamicOptions>

      Optionen für das wiederholbare Formularfeld, z.B. um zu steuern, wieviele wiederholte erzeugte Elemente erlaubt sind oder um Rückruffunktionen zu definieren.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Für ein wiederholbares Element: Erhöht die Anzahl wiederholter Element um eins, erzeugt ein neues Formularelement. Dieses wird am Ende der bereits existierenden wiederholten Elemente hinzugefügt. Das Aufrufen dieser Methode hat die gleiche Auswirkung wie das Betätigen des Plus-Knopfs.

    // Formularelement "tfMail" wiederholbar schalten
    $("[data-name='tfMail']").dynamic();
    // ...
    // Ein weiteres E-Mail-Eingabefeld erzeugen
    $("[data-name='tfMail']").dynamic("addRow");

    Parameters

    • method: "addRow"

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Für ein wiederholbares Element: Entfernt ein wiederholtes Element. Gleiches Resultat wie das Betätigen des Minus-Knopfs am jeweiligen wiederholten Element.

    // Formularelement "tfMail" dynamisch schalten
    $("[data-name='tfMail']").dynamic();
    // ...
    // Das letzte E-Mail-Eingabefeld entfernen
    $("[data-name='tfMail']").dynamic("removeRow");

    Parameters

    • method: "removeRow"

      Name der aufzurufenden Methode.

    • Optional rowIndex: number

      0-basierter Index des zu löschenden Elements. Wenn nicht übergeben, wird das letzte Element gelöscht.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Für ein wiederholbares Element: Ermittelt, wieviele wiederholte Elemente es aktuell gibt.

    // Formularelement "tfMail" wiederholbar schalten
    $("[data-name='tfMail']").dynamic({minSize: 3});
    
    // Anzahl der Wiederholung ist initial 3
    var repetitions = $("[data-name='tfMail']").dynamic("getRowSize");

    Parameters

    • method: "getRowSize"

    Returns number

    Die aktuelle Anzahl an wiederholten erzeugten Elementen.

  • Für ein wiederholbares Element: Erzeugt Formularelemente oder entfernt welche, sodass nun die übergebene Anzahl an wiederholten Formularelementen existiert.

    // Schalte Formularfeld "tfMail" wiederholbar
    $("[data-name='tfMail']").dynamic();
    
    // Setze die Anzahl an wiederholten Formularelementen auf 5.
    $("[data-name='tfMail']").dynamic("setRowSize", 5);

    Parameters

    • method: "setRowSize"

      Name der aufzurufenden Methode.

    • rowSize: number

      Die neu zu setzende Anzahl an wiederholten Formularfeldern.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

error

  • Markiert das Formularfeld als ungültig (wie die Funktion setError) und zeigt eine Fehlermeldung an (wie die Funktion validate).

    Die Funktion setError markiert ein Formularfeld nur als ungültig, zeigt aber nicht sofort eine Fehlermeldung an. Die Fehlermeldung wird erst angezeigt, wenn der Nutzer mit dem Formularfeld interagiert (blur oder change) beziehungsweise versucht, das Formular abzuschicken. Um die Fehlermeldung sofort anzuzeigen, kann die Funktion validate benutzt werden. Diese Funktion erleichert dieses Vorgehen und zeigt sofort eine Fehlermeldung an.

    // Schreibt die Fehlermeldung "Ungültiger Wert" an das Element "tfIdNummer"
    $('[data-name=tfIdNummer').error("Ungültiger Wert");

    Parameters

    • errorMessage: string

      Die Fehlermeldung, die angzeigt werden soll. Darf nicht der leere String sein.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Markiert das Formularfeld als gültig und entfernt die Fehlermeldung. Marks the form field as valid and removes the error message.

    Die Funktion setError markiert ein Formularfeld nur als gültig, entfernt aber nicht sofort die Fehlermeldung. Die Fehlermeldung wird erst entfernt, wenn der Nutzer mit dem Formularfeld interagiert (blur oder change) beziehungsweise versucht, das Formular abzuschicken. Um die Fehlermeldung sofort zu entfernen, kann die Funktion validate benutzt werden. Diese Funktion erleichert dieses Vorgehen und entfernt sofort die Fehlermeldung an.

    // Entfernt die Fehlermeldung vom Element "tfIdNummer"
    $('[name=tfIdNummer').error();

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

errorFunc

  • errorFunc(validatorFunction: function): JQuery
  • Fügt diesem Formularfeld eine Validierungsfunktion hinzu. Die Validierungsfunktion kann benutzt werden, um eigene Logik für die Validierung zu implementieren.

    Die Validierungsfunktion wird jedesmal aufgerufen, wenn sich der Wert des Formularfelds geändert hat oder eine Validierung erforderlich ist, etwa beim Absenden des Formulars.

    Sind mehere Validierungsfunktionen festgelegt, so werden alle Validierungsfunktionen bei der Validierung aufgerufen und alle Fehlermeldungen angezeigt.

    Es ist zu beachten, dass zwischen Mussfelder und Datenvalidierung unterschieden wird. Hat ein Mussfeld keinen Wert, ist das Formularfeld ungültig. Erst wenn in einem Mussfeld ein Wert eingetragen wurde, wird die Datenvalidierung gestartet und geprüft, ob die eingegebenen Daten gültig sind. Die Validierungsfunktion wird erst während der Datenvalidierung aufgerufen. Hat ein Mussfeld also keinen Wert, wird immer eine Fehlermeldung angezeigt, unabhängig der festgelegten Validierungsfunktionen.

    // Der Datentyp des Felds 'tfEmail' wurde auf 'E-Mail' gesetzt.
    // Wir fügen eine zusätzliche Bedingung hinzu: Der Host muss entweder 'example.com' oder 'example.de' lauten.
    $('[name="tfEmail"]').errorFunc(function() {
      var value = String(this.val() || "");
      var hostIndex = value.indexOf("@");
      var host = hostIndex >= 0 ? value.substr(hostIndex + 1) : "";
      if (host === "example.com" || host === "example.de") return "";
      return "Der Host muss entweder example.de oder example.com lauten!";
    });

    Parameters

    • validatorFunction: function

      Validierungsfunktion, welche während der Validierung aufgerufen wird. Ist das Formularfeld ungültig, muss diese Validierungsfunktion eine nichtleere Zeichenkette mit der Fehlermeldung zurückgegben. Ist das Formularfeld gültig, muss diese Validierungsfunktion die leere Zeichnkette zurückgeben.

        • Parameters

          Returns string

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

getContainer

  • getContainer(returnRepetitionContainer?: boolean): JQuery
  • Jedes Formularfeld besteht aus mehreren Elementen, etwa Leittexten (label), Eingabefeldern und Fehlertexten. Diese befinden sich alle in einem Container-Element. Diese Funktion liefert dieses Container-Element zurück.

    Container-Elemente sind DIV-Elemente mit der CSS-Klasse xm-item-div. Zudem hat ein Container-Element das Attribute xn mit dem Namen des Formularelements.

    Für ein Texteingabeld namens tfName liefert $("[data-name='tfName']") etwa das folgende HTML-Element zurück

    <input id="xi-tf-16" name="tfName" class="XItem XTextField" title type="text">

    Und das Suchen des Containers mittels $("[data-name='tfName']").getContainer() liefert etwa folgendes HTML-Element:

    <div class="xm-item-div label-top CXTextField ctfName" cn="XTextField" data-xi="xi-tf-8" data-xn="tfName">
      ...
      <input id="xi-tf-16" name="tfName" class="XItem XTextField" title type="text">
      ...
    </div>

    Verhalten für wiederholte Elemente

    Ein wiederholtes Formularelement ist ein Element, von dem ein Nutzer eine oder mehrere Kopien erstellen kann. Wiederholte Felder werden für die Eingabe von dynamischen Datensätzen verwendet, etwa für die Adressdaten mehrerer Personen. Das Element mit der Klasse xm-item-div ist der Container, welcher alle dynamisch erzeugten Elemente enthält. Jedes erzeugte dynamische Element wiederum befindet sich in einem Container mit der Klasse dynamic-row. Standardmäßig liefert diese Methode immer diesen xm-item-div Container zurück. Ist das optional boolesche Flag returnRepetitionContainer auf true gesetzt, wird stattdessen die dynamic-row zurückgegeben. Falls beispielsweise das Textfeld mit dem Namen tfMail wiederholt ist, dann selektiert $("[data-org-name='tfMail']).eq(1) das zweite dynamisch erzeugte Textfeld und $("[data-org-name='tfMail']).eq(1).getContainer() dementsprechend die zweite dynamic-row innerhalb des xm-item-div.

    <div class="xm-item-div label-top CXTextField ctfMail" data-cn="XTextField"
      data-xi="xi-tf-2" data-xn="tfMail" id="xi-tf-2-xc" data-name="tfMail">
    
      <div data-dynamic-row="0" class="dynamic-row" id="xi-tf-8-xc_c_0">
        <input id="xi-tf-8" name="tfMail_dyn_tfMail_0" class="XItem XTextField" type="text">
      </div>
    
      <div data-dynamic-row="1" class="dynamic-row" id="xi-tf-8-xc_c_1">
        <input id="xi-tf-8" name="tfMail_dyn_tfMail_1" class="XItem XTextField" type="text">
      </div>
    
      <!-- ... -->
    
    </div>

    Parameters

    • Optional returnRepetitionContainer: boolean

      true um den Container einer Elementwiederholung zurückzugeben (falls das selektierte Element ein wiederholtes Element ist), false um immer den Hauptcontainer mit der Klasse xm-item-div zurückzugeben. Wenn nicht angegeben, ist der Standardwert false.

    Returns JQuery

    Das Container-Element des Formularfelds. Wenn es sich nicht um ein Formularfeld handelt und somit kein Container gefunden werden kann, eine leere JQuery-Instanz.

getLabel

  • Jedes Formularfeld besteht aus mehreren Elementen, etwa Leittexten (label), Eingabefeldern und Fehlertexten. Formularfelder zum Eingeben von Daten wie Texteingabefelder oder Auswahlfelder haben einen Leittext. Diese Funktion liefert dieses Leittext-Element zurück.

    // Liefert vom Eingabefeld "tfMail" den Text des Labels zurück, z.B. "Ihre E-Mail-Addresse"
    $("[data-name='tfMail']").getLabel().text();
    
    // Liefert von einem wiederholten Element "tfAngestellte" den Text des
    // zweiten Labels zurück, z.B. "Name des 2. Angestellten"
    $($('[data-org-name=tfAngestellte]').get(1)).getLabel().text();

    Returns JQuery<JQuery<HTMLElement>>

    Ein Feld mit allen Leittext-Elementen (label) der Formularfelder. Wenn ein Formuarfeld keine Leittext hat, wird kein Eintrag in das Feld geschrieben.

hasAttr

  • hasAttr(name: string): boolean
  • Prüft, ob an dem Element ein HTML-Attribut mit dem gegebenen Namen existiert.

    Falls etwa folgendes HTML vorliegt:

    <input name="tfMail" placeholder></input>

    Dann verhält sich diese Funktion wie folgt:

    $("[data-name='tfMail']").hasAttr("name"); // true
    $("[data-name='tfMail']").hasAttr("placeholder"); // true
    $("[data-name='tfMail']").hasAttr("id"); // false

    Parameters

    • name: string

      Names des zu prüfenden HTML-Attributs.

    Returns boolean

    Ob das Element ein Attribut mit dem gegebenen Name hat.

jSignature

  • jSignature(options?: Partial<Settings>): JQuery
  • jSignature(method: "init", options?: Partial<Settings>): JQuery
  • jSignature(method: "reset" | "clear"): JQuery
  • jSignature(method: "destroy"): JQuery
  • jSignature(method: "getData", dataFormat?: "default"): string
  • jSignature(method: "getData", dataFormat: "native"): object[]
  • jSignature(method: "getData", dataFormat: "base30" | "image/jSignature;base30"): string[]
  • jSignature(method: "getData", dataFormat: "svg" | "image/svg+xml"): ["image/svg+xml", string]
  • jSignature(method: "getData", dataFormat: "svgbase64" | "image/svg+xml;base64"): ["image/svg+xml;base64", string]
  • jSignature(method: "getData", dataFormat: "image" | "image/png;base64"): ["image/png;base64", string]
  • jSignature(method: "getData", dataFormat: string): any
  • jSignature(method: "setData" | "importData", dataObject: object[], dataFormat: "native"): JQuery
  • jSignature(method: "setData" | "importData", dataObject: string[], dataFormat: "base30" | "image/jSignature;base30"): JQuery
  • jSignature<T>(method: "setData" | "importData", dataObject: [T, any], dataFormat?: T): JQuery
  • jSignature(method: "setData" | "importData", dataObject: any, dataFormat: string): JQuery
  • jSignature(method: "listPlugins", category: "import" | "export"): string[]
  • jSignature(method: "disable"): JQuery
  • jSignature(method: "enable"): JQuery
  • jSignature(method: "isModified"): boolean
  • jSignature(method: "getSettings"): Settings
  • jSignature<K>(method: "updateSettings", name: K, value: Settings[K], applyImmediately?: boolean): Settings[K]
  • Wandelt ein Eingabefeld (input oder textarea) in ein jSignature-Feld um. Hier kann der Nutzer dann eine handschriftliche Unterschrift mit der Maus oder einem Stift auf einem berührungsempfindlichen Bildschirm eingeben.

    Parameters

    • Optional options: Partial<Settings>

      Optionale Einstellungen für jSignature, etwa Strichfarbe oder Strichbreite.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Wandelt ein Eingabefeld (input oder textarea) in ein jSignature-Feld um. Hier kann der Nutzer dann eine handschriftliche Unterschrift mit der Maus oder einem Stift auf einem berührungsempfindlichen Bildschirm eingeben.

    Parameters

    • method: "init"

      Name der aufzurufenden Methode.

    • Optional options: Partial<Settings>

      Optionale Einstellungen für jSignature, etwa Strichfarbe oder Strichbreite.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Leert das Unterschriftenfeld und den Datenspeicher. Stellt auch die Unterschriftenlinie und andere Dekorelemente wieder her.

    Parameters

    • method: "reset" | "clear"

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Zerstört diese jSignature-Instanz und stellt das ursprüngliche Eingabefeld wieder her.

    Parameters

    • method: "destroy"

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Liefert die aktuellen Strichdaten der gezeichneten Unterschrift zurück.

    Das Datenformat ist hierbei das von Canvas nativ genutzte Format - eine Daten-URL mit Base64-enkodierten PNG-Bitmap-Informationen und sieht wie folgt aus: data:image/png;base64,i1234lkj123;k4;l1j34l1kj3j....

    Parameters

    • method: "getData"
    • Optional dataFormat: "default"

    Returns string

    Die aktuelle Signatur als Daten-URL.

  • Liefert die aktuellen Strichdaten der gezeichneten Unterschrift zurück.

    Das Datenformat ist hierbei das von jSignature verwendete Format zum Zeichnen von mehrere Strichen, also einem Feld aus Objekten mit den Eigenschaften x und y, welche beide ein Feld aus Zahlen sind. Diese Datenstruktur wurde mit dem Ziel gewählt, Geschwindigkeit und Effzienz beim Sammeln von Strichdatenpunkten zu erreichen. Auch wenn es sich um eine weniger intuitive Datenstruktur handelt, so erlaubt sie (a) schnell neue Koordinaten einzufügen, ohne für jede Koordinate ein neues Objekt erzeugen zu müssen und (b) eine einfache Iteration über die Daten mittels Schleifen. Diese Datenstruktur könnte in einen JSON-String umgewandelt werden und zum Speichern verwendet werden, allerdings wird davon abgeraten, da es sich um ein internes Format handelt, welche sich in künftigen Versionen ändern kann. Für ein direktes, kompaktes Format, welches ähnlich zu JSON ist, wird base30 empfohlen. Dieses native Datenformat ist gut zum Ermitteln von statistischen Informatioen (Strichanzahl, Position der Unterschrift auf dem Canvas) und um Striche zu editieren (wie etwa zum Rückgängigmachen des letzten gezeichneten Strichs).

    Parameters

    • method: "getData"
    • dataFormat: "native"

    Returns object[]

    Die aktuelle Signatur.

  • Liefert die aktuellen Strichdaten der gezeichneten Unterschrift zurück.

    Dieses Datenformat ist ein an Base64 orientiertes komprimiertes Format mit dem Ziele hoher Kompaktheit und nativer URL-Kompatibilität. Es handelt sich um eine native Datenstruktur aller Vektoren, welche in eine kompakte Zeichenkettendarstellung umgewandelt wird. Eine mögliche Weise zum Übertragen der Daten auf den Server besteht im Format JSONP, welches in der Praxis eine URL-Längenbeschränkung von 2000 Zeichen aufweist (falls IE unterstützt wird). Dieses Kompressionsformat ist nativ URL-kompatibel und benötigt keine zusätzliche Maskierung von Sonderzeichen und benötigt zugleich auf für komplexe Unterschriften nicht mehr als 2000 Zeichen.

    Parameters

    • method: "getData"
    • dataFormat: "base30" | "image/jSignature;base30"

    Returns string[]

    Die aktuelle Signatur.

  • Liefert die aktuellen Strichdaten der gezeichneten Unterschrift zurück.

    Dieses Datenformat erzeugt aus der aktuellen Signatur ein SVG-Bild (SVG XML text). Alle Striche werden von Rauschen befreit und geglättet. Dieses Format stellt einen Kompromiss zwischen "einfach zum Anschauen" und "hochgradig skalierbar" dar. Die meisten aktuellen Browser unterstützen direkt das Anschauen von SVG-Bildern und zudem kann dieses Format grenzenlos skaliert und für den Druck aufbereitet werden. Die Daten liegen als schlichter Text (plain text) vor und können daher einfach übertragen und gespeichert werden.

    Parameters

    • method: "getData"
    • dataFormat: "svg" | "image/svg+xml"

    Returns ["image/svg+xml", string]

    Die aktuelle Signatur.

  • Liefert die aktuellen Strichdaten der gezeichneten Unterschrift zurück.

    Ahnliche Funktionalität wie das Datenformat "svg", mit dem Unterschied, dass der SVG XML text als Base64 komprimiert wird. Obwohl die meisten Browser nun über native Base64-Enkodierer verfügen (btoa()), gibt es einige Browser wie den Internet Explorer, welche dies darüber nicht verfügen. Für solche Browser wird daher eine eigene software-seitige Implementierung von btoa() benutzt, falls diese Funktion nicht zur Verfügung steht.

    Parameters

    • method: "getData"
    • dataFormat: "svgbase64" | "image/svg+xml;base64"

    Returns ["image/svg+xml;base64", string]

    Die aktuelle Signatur.

  • Liefert die aktuellen Strichdaten der gezeichneten Unterschrift zurück.

    Dieses Format ist ähnlich dem Format native, aber in seine Bestandteile zerlegt, sodass der Mime-Type und die Daten separate Einträge in einer Feldstruktur sind, ähnlich wie beim Format svg.

    Das Datenformat sieht beispielsweise wie folgt aus:

    ["image/png;base64","i123i412i341jijalsdfjijl234123i..."]

    Da der Bildexport vom Browser-Support abhängt und mehr Daten als notwendig zurückliefert, wird dieses Format nur zum Testen und zur Entwicklung empfohlen.

    Parameters

    • method: "getData"
    • dataFormat: "image" | "image/png;base64"

      Name des Datenformats der zurückgelieferten Daten.

    Returns ["image/png;base64", string]

    Die aktuelle Signatur.

  • Liefert die aktuellen Strichdaten der gezeichneten Unterschrift zurück.

    Parameters

    • method: "getData"

      Name der aufzurufenden Methode.

    • dataFormat: string

      Datenformat, in dem die zurückgelieferten Daten formatiert sein sollen.

    Returns any

    Die aktuelle Signatur.

  • Parameters

    • method: "setData" | "importData"

      Name der aufzurufenden Methode.

    • dataObject: object[]

      Daten der Unterschrift, die gesetzt werden soll.

    • dataFormat: "native"

      Name des Datenformats der zurückgelieferten Daten.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Parameters

    • method: "setData" | "importData"

      Name der aufzurufenden Methode.

    • dataObject: string[]

      Daten der Unterschrift, die gesetzt werden soll.

    • dataFormat: "base30" | "image/jSignature;base30"

      Name des Datenformats der zurückgelieferten Daten.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Type parameters

    • T: string

    Parameters

    • method: "setData" | "importData"

      Name der aufzurufenden Methode.

    • dataObject: [T, any]

      Daten der Unterschrift, die gesetzt werden soll. Das Datenformat wird aus dem ersten Element des Felds genommen. Das zweite Element stellt die eigentlichen Daten dar.

    • Optional dataFormat: T

      Optional. Wenn gegeben, muss es mit dem ersten Eintrag des Felds des Parameters dataObject übereinstimmen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Parameters

    • method: "setData" | "importData"

      Name der aufzurufenden Methode.

    • dataObject: any

      Daten der Unterschrift, die gesetzt werden soll. Muss in dem angegebenen Format formattiert sein.

    • dataFormat: string

      Datenformat der Daten.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Listet alle Plugin auf, die zum Exportieren beziehungszweise zum Importieren der Unterschriftsdaten zur Verfügung stehen.

    Parameters

    • method: "listPlugins"

      Name der aufzurufenden Methode.

    • category: "import" | "export"

      Kategorie der zurückzulieferenden Plugins, entweder import oder export.

    Returns string[]

    Eine Liste mit allen Plugins der gegebenen Kategorie.

  • Markiert das Canvas als schreibgeschützt und deaktiviert die jSignature-Schalftflächen.

    Parameters

    • method: "disable"

      Name der aufzurufenden Methode.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Hebt den Schreibschutzt des Canvas auf und aktiviert die jSignature-Schalftflächen.

    Parameters

    • method: "enable"

      Name der aufzurufenden Methode.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Prüft, ob seit der Initialisierung eine Eingabe am Unterschriftenfeld getätigt wurden.

    Parameters

    • method: "isModified"

      Name der aufzurufenden Methode.

    Returns boolean

    true, falls die Unterschrift geändert wurde, andernfalls false.

  • Parameters

    • method: "getSettings"

      Name der aufzurufenden Methode.

    Returns Settings

    Die derzeitigen Einstellungen der jSignature-Instanz.

  • Setzt einen anderen Wert für die gegebene Einstellungen.

    Dies ermöglicht es etwa, Einstellungen wie die Strichbreite oder die Linienfarbe zu ändern. Das dritte Argument legt fest, ob die Unterschrift sofort mit der Einstellungen aktualisiert werden soll. Das sofortige Anwenden der Einstellungen funktioniert derzeit nur mit einigen Einstellungen wie derFarbe.

    Type parameters

    • K: keyof Settings

    Parameters

    • method: "updateSettings"

      Name der aufzurufenden Methode.

    • name: K

      Name der zu änderenden Einstellung.

    • value: Settings[K]

      Neuer Wert der Einstellung.

    • Optional applyImmediately: boolean

      Wenn true, wird die geänderte Einstellungen sofort auf die aktuelle Unterschrift angewendet. Wenn false, wird der neue Wert der Einstellung nur auf künftigen Striche angewendet.

    Returns Settings[K]

    Der neue Wert der Einstellung.

on

  • on(event: "addRow", callback: function): JQuery
  • on(event: "delRow", callback: function): JQuery
  • on(event: "ready", callback: function): JQuery
  • Muss direkt auf das Formularelement (FORM.xm-form) aufgerufen werden.

    Erlaubt die Registrierung einer globalen Rückruffunktion, wenn ein neues wiederholbares Element erzeugt wurde. Ein wiederholbares Element erlaubt dem Nutzer, eine oder mehrere Kopien zu erzeugen, etwa zur Eingabe von mehreren E-Mail-Adressen.

    Im Gegensatz zur Rückruffuntkion, die mittels dynamic registriert werden kann, wird diese Rückruffunktion global für jedes dynamische Formularfeld im Formular aufgerufen. Das ist etwa nützlich, wenn ein Element über den Designer wiederholbar geschaltet wird und nicht direkt mittels JavaScript.

    // Neu hinzugefügte Formularfelder mit cob2auto initialisieren (Autovervollständigung)
    $('FORM.xm-form').on("addRow", function(_, data) {
      data.container.find(".XSelect").cob2auto();
    });

    Parameters

    • event: "addRow"

      Der Name des Ereignisses, also addRow.

    • callback: function

      Rückruffunktion für das Ereignis beim Hinzufügen eines Elements. Sie erhält als Parameter das auslösende Ereignis (meistens click) und den Container mit dem dynamisch erzeugten Element.

        • (this: HTMLElement, event: JQuery.TriggeredEvent, data: object): void
        • Parameters

          • this: HTMLElement
          • event: JQuery.TriggeredEvent
          • data: object

          Returns void

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Muss direkt auf das Formularelement (FORM.xm-form) aufgerufen werden.

    Erlaubt die Registrierung einer globalen Rückruffunktion, wenn ein wiederholbares Element entfernt wurde. Ein wiederholbares Element erlaubt dem Nutzer, eine oder mehrere Kopien zu erzeugen, etwa zur Eingabe von mehreren E-Mail-Adressen.

    Im Gegensatz zur Rückruffuntkion, die mittels dynamic registriert werden kann, wird diese Rückruffunktion global für jedes wiederholbare Formularfeld im Formular aufgerufen. Das ist etwa nützlich, wenn ein Element über den Designer wiederholbar geschaltet wird und nicht direkt mittels JavaScript.

    // Beim Entfernen eines Elements die Versandkosten neu berechnen
    $('FORM.xm-form').on("delRow", function(_, data) {
      recalculateVersandkosten();
    });

    Parameters

    • event: "delRow"

      Der Name des Ereignisses, also delRow.

    • callback: function

      Rückruffunktion, wenn ein dynamisches Element entfernt wurde. Sie erhält als Parameter das auslösende Ereigniss (meist click) und den (nicht mehr im DOM eingehängten) Container mit dem entfernten dynamischen Element.

        • (this: HTMLElement, event: JQuery.TriggeredEvent, data: object): void
        • Parameters

          • this: HTMLElement
          • event: JQuery.TriggeredEvent
          • data: object

          Returns void

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Erlaubt es, eine Rückruffunktion zu registrieren, welche aufgerufen wird, sobald dass Formular vollständig dargestellt und initialisiert wurde.

    Parameters

    • event: "ready"

      Der Name des Ereignisses, also ready.

    • callback: function

      Rückruffunktion, welche aufgerufen wird, sobald dass Formular vollständig dargestellt und initialisiert wurde.

        • (this: HTMLElement): void
        • Parameters

          • this: HTMLElement

          Returns void

    Returns JQuery

removeStar

  • Entfernt das kleine rote Sternchen neben dem Leittext eines Formularfelds, welches angibt, ob es sich bei dem Formularfeld um ein Mussfeld handelt.

    Derzeit ist dieses Sternchen mittels eines SPAN-Elements mit der Klasse required-star umgesetzt, dies kann sich allerdings ändern.

    <span class="required-star">*</span>

    Beispiel:

    // Entfernt das Sternchen vom Leittext des Formularfelds "tfName".
    $('input[name=tfName]').removeStar();

    Diese Funktion beeinflusst nur das Aussehen, ändert aber nicht, ob das Formularfeld ein Mussfeld ist. Ist das Eingabefeld leer, werden daher weiter Fehlermeldungen angezigt. Um zu ändern, ob das Feld ein Mussfeld ist, sollte die Funktion setRequired benutzt werden.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

replaceParams

  • Diese Methode ist veraltet und sollte nicht mehr benutzt werden, dass sie Formular anfällig für XSS-Angriffe (cross-site scripting) macht.

    Es können etwa $.xutil.getFormParam und JQuery-Methoden wie {@link JQuery.text|$.fn.text} genutzt werden, um Daten aus URL-Parametern in das Formular einzufügen.

    Ersetzt im HTML eines Formularelement (innerHTML) Ausdrücke einer bestimmten Form mit Werten aus den URL-Parametern der aktuellen URL, über die das Formular aufgerufen wurde.

    Ausdrücke der folgenden Form, wobei KEY für den Namen des URL-Parameters steht, werden ersetzt:

    {KEY}

    Für jeden URL-Parameter wird das erste Auftreten obigen Ausdrucks durch den Wert des URL-Parameters KEY ersetzt. Angenommen, ein Formular wird aufgerufen über die URL

    http://localhost/formcycle/form/provide/1?name=Welt

    Im Formular gibt es ein Textfeld mit dem Namen tfGruss und dem Label Hello, {name}!:

    // Ersetzt im innerHTML-String des div-Container-Elements "{name}" durch "{world}".
    $("[xn='tfGruss']").replaceParams();

    Somit lautet das Label des Eingabefelds nun Hallo, Welt!.

    deprecated

    Diese Methode ist veraltet und sollte nicht mehr benutzt werden, dass sie Formular anfällig für XSS-Angriffe (cross-site scripting) macht.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setDataType

  • Ändert den Datentypen eines Texteingabefelds (einzeiliges Eingabefeld oder mehrzeiliges Eingabefeld). Die folgenden Datentypen stehen zur Verfügung:

    • dateDE: Erlaubt nur Datumsangaben nach dem deutschen Format (TT.MM.JJJJ), z.B. 22.05.1990.
    • email: Erlaubt nur gültige (internationale) E-Mail-Adressen, z.B. james@john.org or θσερ@εχαμπλε.ψομ.
    • integer: Erlaubt nur Ganzzahlen, also Zahlen ohne Komma, z.B. 3, 0 oder -21.
    • ipv4: Erlaubt nur gültige IP4-Adressen, z.B. 127.0.0.1 oder 10.42.42.13.
    • money: Erlaubt nur gültige Geldbeträge, also Zahlen mit genau zwei Nachkommastellen, z.B. 2,00, -3,95, 0,00 oder 897345,38.
    • number: Erlaubt nur Zahlen, mit oder ohne Komma. Z.B: 0.03, -99.2 oder 42.
    • onlyLetterNumber: Erlaubt nur Buchstaben, Zahlen und Leerzeichen.
    • onlyLetterSp: Erlaubt nur Buchstaben und Leerzeichen.
    • phone: Erlaubt nur gültige Telefonnummern, z.B. 0234995483 oder +49 351 4459654.
    • plzDE: Erlaubt nur gültige deutsche Postleitzahlen, also genau fünf Ziffern, z.B. 02349. Prüft nicht, ob es solch eine Postleitzahl tatsächlich in Deutschland gibt.
    • posinteger: Erlaubt nur positive Ganzzahlen, z.B. 0, 3 oder 123.
    • posmoney : Erlaubt nur gültige, positive Geldbeträge mit genau zwei Nachkommastellen, z.B. 0,00 oder 2,34.
    • posmoneyOptionalComma: Erlaubt nur gültige, positive Geldbeträge, mit oder ohne Nachkommastellen, z.B. 0,00, 0, 3,4 oder 3.
    • regexp: Erlaubt es dem Formularersteller, einen eigenen regulären Ausdruck füri die Validierung einzugeben.
    • text: Wendet keine Einschränkungen an und erlaubt jede Eingabe.
    • time: Erlaubt nur gültige Zeitangaben in dem Format hh:mm, z.B. 22:05 or 03:42.
    • url: Erlaubt nur gültige URLs, welche das Protokoll enthalten müssen, z.B. http://example.com oder https://www.james.org.

    Beispiel:

    // Prüft nun, ob eine gültige E-Mail-Adresse eingegeben wurde.
    $('[name="tfMail"').setDataType("email")

    Beim Datentyp date wird ein Kalender zur Auswahl des Datums angezeigt. Wenn der Datentyp auf ein Datum gesetzt wurde und nun der Datentyp per JavaScript geändert wird, erscheint immer noch ein Kalender. Wenn der Datentyp im Designer auf einen anderen Wert gesetzt wurde und nun per JavaScript auf ein Datum geändert wird, erscheint kein Kalender. Falls notwendig, muss hier direkt jQuery.fn.datepicker gerufen werden.

    Der Datentyp kann auch direkt im XIMA formcycle-Designer eingestellt werden.

    Derzeit werden die HTML-Attribute type und vdt genutzt, dies wird sich allerdings ändern.

    Parameters

    • dataType: FormVruleType | string

      Der neue Datentyp für das Eingabefeld.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt den Datentypen eines Texteingabefelds (einzeiliges Eingabefeld oder mehrzeiliges Eingabefeld). Es kann nun ein beliebiger Wert eingegeben werden. Es wird nicht mehr validiert, ob es sich um einge gültige E-Mail-Adresse, Postleitzahl etc. handelt.

    Beispiel:

    // Prüft nun nicht mehr, ob eine gültige E-Mail-Adresse eingegeben wurde.
    $('[name="tfMail"').setDataType()

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setError

  • Markiert ein Formularfeld als ungültig und setzt die Fehlermeldung.

    Die Fehlermeldung erscheint nicht sofort. Erst, wenn der Nutzer mit dem Formularfeld interagiert, wird die Fehlermeldung angezeigt, etwa bei einem blur- oder change-Ereignis; oder wenn das Formular wie beim Absenden validiert wird. Mittels der Funktion validate kann die Validierung angestoßen werden, um die Fehlermeldung sofort anzuzeigen.

    // Markiert das Eingabefeld als ungültig und setzt die Fehlermeldung.
    $('[name="tfName"').setError("Ungültiger Name.");
    // Validiert das Eingabefeld und zeigt die Fehlermeldung an.
    $('[name="tfName"').validate();

    Derzeit wird das HTML-Attribut error genutzt, dies kann sich aber ändern.

    Parameters

    • errorMessage: string

      Die Fehlernachricht, die am Element angezeigt werden soll.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Markiert das Formularfeld als gültig und entfernt die Fehlermeldung.

    Die Fehlermeldung verschwindet nicht sofort. Erst, wenn der Nutzer mit dem Formularfeld interagiert, wird die Fehlermeldung entfernt, etwa bei einem blur- oder change-Ereignis; oder wenn das Formular wie beim Absenden validiert wird. Mittels der Funktionvalidate` kann die Validierung angestoßen werden, um die Fehlermeldung sofort zu entfernen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setGroupReq

  • setGroupReq(groupreq: string): JQuery
  • setGroupReq(): JQuery
  • Setzt oder ändert die Mussfeldgruppe des Formularelements. Es können sich mehrere Formularelemente in einer Mussfeldgruppe befinden. Ein Formularelement ist nur dann gültig, wenn wenigstens ein Element aus der Mussfeldgruppe ausgefüllt wurde und einen Wert hat.

    Diese Funktion ändert nicht, ob das Formularelement selbst ein Mussfeld ist, zum Beispiel:

    Das Formularfeld tf1 wurde bereits im Designer als Mussfeld markiert, das Feld tf2 nicht. Nun wird diese Funktion benutzt, um die Mussfeldgruppe beider Felder auf "Gruppe1" zu setzen. Ist das Feld tf1 noch leer, so wird eine Fehlermeldung angezeigt, auch wenn im Feld tf2 ein Wert eingetragen wurden. Daher sollte im Designer das Feld tf1 nicht als Mussfeld markiert werden. Sonst muss dies nachträglich mittels der Funktion setRequired nachgeholt werden:

    // Fügt Textfeld "tf1" der Mussfeldgruppe "gruppe1" hinzu.
    $('[name=tf1]').setGroupReq("gruppe1");
    
    // Fügt Textfeld "tf2" der Mussfeldgruppe "gruppe1" hinzu.
    $('[name=tf2]').setGroupReq("gruppe1");
    
    // Entfernt die Markierung von Textfeld "tf1" als Mussfeld.
    $('[name=tf1]').setRequired(false);

    Die Mussfeldgruppe kann auch direkt im XIMA formcycle-Designer gesetzt werden.

    Derzeit nutzen Mussfeldgruppen das HTML-Attribut vgr, dies wird sich allerdings ändern.

    Parameters

    • groupreq: string

      Name der Mussfeldgruppe, die auf das Element gesetzt werden soll.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt die Mussfeldgruppen an dem Formularfeld.

    Falls das Formularfeld zudem als Mussfeld markiert werden soll, kann die Funktion setRequired genutzt werden.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setMaxCheckBox

  • setMaxCheckBox(maxCheckBox: number): JQuery
  • setMaxCheckBox(): JQuery
  • Setzt oder ändert die Höchstanzahl an erlaubten ausgewählten Optionen eines Mehrfachauswahlelements.

    Dieses Grenze kann auch direkt im XIMA formcycle-Designer gesetzt werden.

    // Es können nun höchstens drei Checkboxen am Feld "selTermine" angehakt werden.
    $('[name=selTermine').setMaxCheckBox(3)

    Derzeit wird das HTML-Attribut `vcmx genutzt, dies wird sich allerdings ändern.

    Parameters

    • maxCheckBox: number

      Die Höchstzahl an Optione, die ausgewählt werden darf.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt die Einschränkung an die Höchstzahl an auswählbaren Optionen eines Mehrfachauswahlfelds.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setMaxLength

  • setMaxLength(maxLength: number): JQuery
  • setMaxLength(): JQuery
  • Setzt oder ändert die Höchstlänge eines Eingabefelds, also die maximale Anzahl an Zeichen), die eingegeben werden dürfen.

    // Der Nutzer darf nicht mehr als neun Zeichen im Feld "tfId" eingeben.
    $('[name="tfId"').setMaxLength(9)

    Die Höchstlänge kann auch direkt im XIMA formcycle-Designer geändert werden.

    Derzeit wird das HTML-Attribut vmxl genutzt, dies wird sich allerdings ändern.

    Parameters

    • maxLength: number

      Höchtzahl (inklusiv) an erlaubten Zeichen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt die Einschränkung an die Höchstlänge eines Eingabefelds, also die maximale Anzahl an Zeichen, die eingegeben werden dürfen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setMaxValue

  • setMaxValue(maxValue: number): JQuery
  • setMaxValue(): JQuery
  • Setzt oder ändert an einem nummerischen Eingabefeld die höchste erlaubte Zahl, die eingegeben werden darf.

    // Im Feld "tfAnzahl" muss eine Zahl kleiner oder gleich 9 eingegeben werden.
    $('[name="tfAnzahl"').setMaxValue(9);

    Der Höchstwert kann auch direkt XIMA formcycle-Designer gesetzt werden.

    Derzeit wird das HTML-Attribut vmx genutzt, dies kann sich aber ändern.

    Parameters

    • maxValue: number

      Der Höchstwert (inklusive), der für das Eingabefeld erlaubt ist.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt an einem nummerischen Eingabefeld die Einschänkung an die höchste erlaubte Zahl, die eingegeben werden darf.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setMinCheckBox

  • setMinCheckBox(minCheckBox: number): JQuery
  • setMinCheckBox(): JQuery
  • Setzt oder ändert die Mindestanzahl an erlaubten ausgewählten Optionen eines Mehrfachauswahlelements.

    // Wenigstens eine Checkbox muss am Auswahlfeld "selTermine" ausgewählt werden.
    $('[name=selTermine').setMinCheckBox(1);

    Die Mindestanzahl kann auch direkt im XIMA formcycle-Designer gesetzt werden.

    Derzeit wird das HTML-Attribut vcmn genutzt, dies wird sich allerdings ändern.

    Parameters

    • minCheckBox: number

      Die geringste Anzahl (inklusiv) an Optione, die am Auswahlfeld ausgewählt werden müssen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt die Einschränkung der Mindestanzahl an erlaubten ausgewählten Optionen eines Mehrfachauswahlelements.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setMinLength

  • setMinLength(minLength: number): JQuery
  • setMinLength(): JQuery
  • Setzt oder ändert die Höchstlänge eines Eingabefelds, also die minimale Anzahl an Zeichen, die eingegeben werden müssen.

    // Der Nutzer muss wenigstens zwei Zeichen in das Eingabefeld "tfId" eingeben.
    $('[name="tfId"').setMinLength(2);

    Die Höchstlänge kann auch direkt im XIMA formcycle-Designer geändert werden.

    Derzeit wird das HTML-Attribut vmnl genutzt, dies wird sich allerdings ändern.

    Parameters

    • minLength: number

      Mindestanzahl (inklusiv) an erlaubten Zeichen, die eingegeben werden müssen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt die Einschränkung an die Mindestlänge eines Eingabefelds, also die minimale Anzahl an Zeichen, die eingegeben werden müssen.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setMinValue

  • setMinValue(minValue: number): JQuery
  • setMinValue(): JQuery
  • Setzt oder ändert an einem nummerischen Eingabefeld die geringste erlaubte Zahl, die eingegeben werden darf.

    // Im Feld "tfAnzahl" muss ein Wert größer oder gleich zwei eingegeben werden.
    $('[name="tfAnzahl"').setMinValue(2);

    Diese Untergrenze kann auch direkt im XIMA formcycle-Designer eingestellt werden.

    Derzeit wird das HTML-Attribut vmn genutzt, dies wird sich allerdings ändern.

    Parameters

    • minValue: number

      Der geringste Wert (inklusiv), der für das Eingabefeld erlaubt ist.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt an einem nummerischen Eingabefeld die Einschänkung an die geringste erlaubte Zahl, die eingegeben werden darf.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setMustEqual

  • Setzt den Namen des Formularfelds, mit dem der Wert dieses Formularfelds übereinstimmen muss.

    Gibt es beispielsweise die beiden Formularfeld "tfNutzername" und "tfNutzernameWiederholung", so wird ein Fehler angezeigt, wenn im Feld "tfNutzernameWiederholung" ein anderer Wert eingegeben wird als im Feld "tfNutzername".

    // Wiederholung der E-Mail muss gleich der eingegebenen E-Mail sein
    $('[data-name=tfMailWdh]').setMustEqual("tfMail");

    Die Anwendung dieser Funktion ist nur für Textfelder und Textareas gedacht und könnte deshalb bei der Benutzung mit anderen Formularelement-Typen zu Fehlern führen.

    Diese Einstellung kann auch direkt im XIMA formcycle-Designer festgelegt werden.

    Derzeit wird das HTML-Attribut veq verwendet, dies wird sich allerdings ändern.

    Parameters

    • name: string

      Name des refernzierten Formularfelds, mit dem der Wert dieses Felds übereinstimmen muss.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Entfernt die Einschränkung, dass der Wert dieses Formularfelds mit einem anderen Formularfeld übereinstimmen muss.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setRequired

  • setRequired(required: boolean): JQuery
  • Stellt ein, ob das Formularfeld ein Mussfeld ist. Ein Mussfeld ist ungültig, wenn kein Wert eingeben wurde.

    // Der Nutzer muss im Feld "tfMail" eine (gültige) E-Mail-Adresse eingeben.
    $('[data-name=tfMail').setRequired(true);

    Die Markierung als Mussfeld kann auch direkt im XIMA formcycle-Designer vorgenommen werden.

    Derzeit wird das Attribut vr genutzt, dies wird sich allerdings ändern.

    Parameters

    • required: boolean

      Wenn true, wird das Formularfeld als Mussfeld markiert. Wenn false, ist es kein Mussfeld mehr.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

setRequiredIf

  • setRequiredIf(name: string, test?: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | number, value?: string | number): JQuery
  • setRequiredIf(): JQuery
  • Ein Formularfeld kann so eingestellt werden, dass es nur dann ein Mussfeld ist, wenn ein anderes Formularfeld einen bestimmten Wert hat. Diese Funktion erlaubt es, diese Abhängigkeit zu ändern.

    Um beispielsweise ein Eingabefeld für den Straßennamen nur dann als Mussfeld zu schalten, wenn im Feld "selAdressart" die Option "Anschrift" (und nicht "Postfach") ausgewählt ist:

    // Mussfeld nur, wenn "Anschrift" und nicht "Postfach" ausgewählt ist
    $('[data-name="tfStrasse"]').setRequiredIf("selAdressart", 1, "Anschrift");

    Diese Einstellung kann auch direkt im XIMA formcycle-Designer vorgenommen werden.

    Derzeit werden die HTML-Attribute vrif_c und vrif_v genutzt, dies wird sich allerdings ändern.

    Die folgenden Werte sind für die Art der Überprüfung erlaubt:

    • 0 (hat einen Wert) Dieses Formularfeld ist Mussfeld, wenn das andere Formularfeld nicht leer ist (hierbei wird der Wert des Parameters value nicht relevant).
    • 1 (stimmt überein) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfelds mit dem gegebenen Wert übereinstimmt.
    • 2 (stimmt nicht überein) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfeld nicht mit dem gegebenen Wert übereinstimmt.
    • 3 (regulärer Ausdruck) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfelds auf den regulären Ausdruck passt (hierbei enthält der Parameter value den regulären Ausdruck als Zeichenkette).
    • 4 (kleiner als) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfelds kleiner als der gegebene Wert ist.
    • 5 (größer als) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfelds größer als der gegebene Wert ist.
    • 6 (zwischen) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfelds zwischen zwei Werten liegt (hierbei hat der Parameter value das Format x-y, also z.B. 1-23).
    • 7 (kleiner oder gleich) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfelds kleiner oder gleichem dem gegebenen Wert ist.
    • 8 (größer oder gleich) Dieses Formularfeld ist Mussfeld, wenn der Wert des anderen Formularfelds größer oder gleichem dem gegebenen Wert ist.
    • 9 (keinen Wert hat) Dieses Formularfeld ist Mussfeld, wenn das andere Formularfeld keinen Wert hat.

    Parameters

    • name: string

      Der Name des Formularfelds, von dessen Wert es abhängen soll, ob dieses Feld ein Mussfeld ist.

    • Optional test: 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | number

      Die Art des Vergleichs, wie der Wert des anderen Formularfelds geprüft wird. Siehe oben für Details. Wenn nicht gegeben, ist der Standardwert 0.

    • Optional value: string | number

      Wert für den Vergleich, mit dem das andere Formularfeld verglichen wird. Standardwert ist die leere Zeichenkette.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Ein Formularfeld kann so eingestellt werden, dass es nur dann ein Mussfeld ist, wenn ein anderes Formularfeld einen bestimmten Wert hat. Diese Funktion entfernt diese Abhängigkeit.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

showStar

  • showStar(show: boolean): JQuery
  • Fügt das kleine rote Sternchen neben dem Leittext eines Formularfelds hinzu oder entfernt es. Dieses Sternchen gibt an, ob es sich bei dem Formularfeld um ein Mussfeld handelt.

    Derzeit ist dieses Sternchen mittels eines SPAN-Elements mit der Klasse required-star umgesetzt, dies kann sich allerdings ändern.

    <span class="required-star">*</span>

    Beispiel:

    // Entfernt das Sternchen vom Leittext des Formularfelds "tfName".
    $('input[name=tfName]').showStar(false);
    // Fügt das Sternchen dem Leittext des Formularfelds "tfName" hinzu.
    $('input[name=tfName]').showStar(true);

    Diese Funktion beeinflusst nur das Aussehen, ändert aber nicht, ob das Formularfeld ein Mussfeld ist. Ist das Eingabefeld leer, werden daher weiter Fehlermeldungen angezigt. Um zu ändern, ob das Feld ein Mussfeld ist, sollte die Funktion setRequired benutzt werden.

    Parameters

    • show: boolean

      true um das Sternchen anzuzeigen, false um es auszublenden.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

sum

  • sum(): number
  • Bildet die Summe aller Formularfelder, wobei versucht wird, den Wert jedes Formularfelds als Zahl zu interpretieren. Diese Methode sollte nur auf Textfelder und Textareas angewendet werden. Besonders nützlich ist diese Methode für wiederholte Elemente, wenn die Werte aller dynamisch erzeugten Felder addiert werden sollen. Es sollte beachtet werden, dass bei wiederholten Formularfeldern die einzelnen Eingabefelder über das Attribut org_name und nicht über name selektiert werden sollten.

    // Bildet die Summe aller dynamisch erstellten Kopien des Textfelds mit dem Namen "tfZahlungsbetrag".
    var sum = $("[org_name='tfPayment']").sum();

    Returns number

    Die (nummerische) Summe der Werte aller selektieren Formularfelder.

validate

  • validate(silent?: boolean): boolean
  • Validiert das Formularfeld und alle in ihm enthaltenen Formularfelder.

    Eine Fehlernachricht wird an allen Elementen angezeigt, die ungültig sind. Ungültig sind Mussfelder, die nicht ausgefüllt wurden, sowie Felder, welche falsch ausgefüllt wurden (z.B. ungültige E-Mail-Adresse).

    Standardmäßig wird die Validierung nur ausgeführt, wenn der Nutzer den Wert des Formularfelds ändert und es wieder verlässt (blur bei Eingabefeldern beziehungsweise. change bei Checkboxen). Zudem wird auch beim Versuch, das Formular abzusenden, validiert.

    Ein Anwendungsfall für diese Funktion beseteht darin, ein Eingabefeld jedesmal zu validieren, wenn der Nutzer ein Buchstaben eingibt oder eine Taste auf der Tastatur drückt. Dies sollte mit Bedacht eingesetzt werden, da es bei großen Formularen auf aufwendigen Validierungen zu Performanzproblemen kommen kann.

    // Validiert das Eingabefeld "tfId" bei jedem Tastendruck
    $("[data-name='tfId']").on("keydown", function(event) { $(event.target).validate(); });
    
    // Überprüft das gesamte Formular
    var isFormValid = $(".xm-form").validate();

    Parameters

    • Optional silent: boolean

      Optional, Standardwert false. Wenn true, wird keine Fehlernachricht an invalide Elemente angefügt. Kann etwa nützlich sein, wenn nur geprüft werden soll, ob ein Element valide ist, ohne den Nutzer davon in Kenntnis zu setzen.

    Returns boolean

    true, wenn alle validierten Formularfelder gültig sind, false otherwise.

vattr

  • vattr(validationAttributeName: string): JQuery
  • vattr(validationAttributeName: string, value: unknown): JQuery
  • Entfernt das gegeebene Validationsattribut von dem Formularfeld. Dies ist eine Low-Level-Methode, es sollte eine der spezifischeren Methoden für Validationsattribute genutzt werden, wie etwa setRequired.

    Parameters

    • validationAttributeName: string

      Name des zu entfernenden Validationsattributs.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

  • Setzt das Validationsattribut für das Formularfeld auf den gegebenen Wert. Dies ist eine Low-Level-Methode, es sollte eine der spezifischeren Methoden für Validationsattribute genutzt werden, wie etwa setRequired.

    Parameters

    • validationAttributeName: string

      Name des zu ändernden Validationsattributs.

    • value: unknown

      Neuer Wert für das Validationsattribut. Wenn undefined, wird das Validationsattribut entfernt.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.

visible

  • visible(show: boolean): JQuery
  • Zeigt das Formularfeld an oder versteckt es. Diese Funktion sollte statt den JQuery-Funktionen hide und show verwendet werden, da sie auch einige XIMA formcycle-spezifische Attribute aktualisiert.

    Ist ein Formularfeld versteckt, so ist es nie ungültig und kann somit auch nie das Absenden eines Formulars verhindern.

    Achtung: Diese Methode ändert nur den Sichtbarkeitszustand von genau dem Element, auf das sie gerufen wird. Soll etwa nicht nur das Eingabefeld, sondern auch das dazugehörige Label mit ausgeblendet werden, kann wie folgt vorgegangen werden:

    // Macht das Eingabefeld "tfNachname" unsichtbar.
    $("[data-name='tfNachname']").getContainer().visible(false);

    Parameters

    • show: boolean

      If true, shows the form field. If false, hides the form field.

    Returns JQuery

    Diese JQuery-Instanz zum Verketten von Befehlen.