Baumstruktur

DirectoryTree

Die DirectoryTree erlaubt es eine Baumstruktur für die Auswahl von Dateien festzulegen. Eine neue Liste wird über DirectoryTree(options) erstellt.

Schlüssel Beschreibung Default Beispiel
class CSS-Klasse der Liste undefined
id ID der Liste undefined myID
root Verzeichnis auf dem Server /
script Script #

Wenn ein Eintrag ausgewählt wurde, wird der Event change.ALVINE.FILETREE gefeuert. Als Parameter wird das Objekt und die ausgewählte Datei übergeben.

Tree

Tree-Element

Zur Dartsellung von Bäumen kann das Tree-Objekt zum Einsatz kommen. Die Daten von dem Tree kommen in der Standardkonfiguration über eine url. In der URL können die Platzhalter ${id}, ${parent} und ${text} verwendet werden. Das Objekt erwartet immer eine Ebene der Daten, so daß in der URL die Ebene mitgegeben werden muß: http://example.com/datay?parent=${id}.

Das Ergebnis vom Server wird über die Methode Tree.mapDataToNode(map) in das vom Tree verwendete Format gebracht. Das Mapping erfolgt in dieser Funktion über die Schlüssel map.key, map.label, map.parent und map.rootsign. Die Funktion kann aber auch komplett selbst implementiert werden.

Wird eine Node ausgewählt, so wird das Event select.ALVINE.TREE mit den Parametern Tree-Instanz und der gewählten Node gefeuert.

filelist = new Alvine.Package.UI.Dialog.Tree(
    {
            'map.key': 'id',
            'map.label': 'name',
            'map.parent': 'parent',
            'url': 'http://example.com/data?parent=${id}'
    });

Alternativ können die Daten auch direkt bereitgestellt werden. Hierzu muss die Eigenschaft fetchData gesetzt werden.

options = {
    'fetchData': function(node, callback) {
                if(node.id==='#') {
                    callback.call(this,
                       [{id:'14',text:'Root 1', icon:'fa fa-cog'}, 'Root 2']);
                } else {
                    callback.call(this,
                       ['Child 1', 'Child 2']);
                }
            }
        };

Tree-Element mit Icon

Schlüssel Beschreibung Default Beispiel
class CSS-Klasse der Baumstruktur undefined
fetchData Konfiguration des Datenabrufs undefined
id ID des Baums undefined
url URL des Datasets undefined
multiple Mehrfachselektion im Baum false
plugins Verwendung von Erweiterungen ['changed', 'state', 'unique']
map.key Name des Schlüssels im Datensatz vom Server undefined
map.label Name des Datenfeldes das angezeigt werden soll undefined
map.parent Name des Elements das auf die Elternstruktur zeigt undefined
map.rootsign Wie wird die Rootnode vom Server geliefert 0
themes.name Name des Theme, oder flase für das Default-Theme false
themes.icons Ob Icons anzeigt werden sollen false
themes.ellipsis Ob Ellipsen angezeigt werden sollen true
themes.stripes Ob Striche angezeigt werden sollen false
themes.dots Ob Punkte angezeigt werden sollen true
response.subkey Unterschlüssel, in dem die Datensätze liegen dataset