Oggetto treeview è il classico controllo per la visualizzazione ad albero, molto utilizzato per la rappresentazione di filesystem ed in generale strutture gerarchiche.
In base al valore assegnato all'attributo refresh l'oggetto tree ha tre modalità di funzionamento:

  • tree: al primo caricamento istanzia tutti i nodi
  • branche: carica i nodi parzialmente per ramo alla sua prima espanzione
  • always: carica i nodi parzialmente per ramo, ogni qualvolta il ramo viene riaperto i nodi vengono rigenerati
<idtag typeobj="tree" dsobj="nomeds" refresh="tiporefresh" ............. />

Per un corretto funzionamento dell'oggetto tree è necessario che le impostazione degli attributi dell'oggetto tree siano attinenti al datasource connesso, per spiegare questo concetto facciamo qualche esempio pratico:

// ESEMPIO VOLUTAMENTE ERRATO
<ds1 typeobj="ds" conn="conn4" scope="tree" dskey="key" base="/jamp/data" />
<tree1 typeobj="tree" dsobj="nomeds" refresh="brance" ............. />';

Tale impostazione è certamente errata in quanto abbiamo impostato l'attributo scope="tree" nel datasource ossia abbiamo chiesto la restituzione di tutti i valori e quindi di conseguenza questo farà popolare l'intero tree in fase di primo caricamento, l'errore sta nel fatto di aver poi assegnato refresh="brance" nell'oggetto tree, questo è un errore perchè non appena cerchermo di espandere il ramo ad i nodi già presenti si verranno ad aggiungere quelli della richiesta che automaticamente l'oggetto effettuerà con il risultato di duplicare tutti i nodi.

Menù Contestuale

E' possibile associare all'oggetto il menù contestuale. La voce del menù viene visualizzata se il valore del campo nodetype del datasource associato soddisfa l'espressione regolare contenuta nel campo menufilter.

  • oncontextmenu: Abilità il menu contestuale true/false
  • menuname: voce del menù
  • menufunction: nome della funzione javascript associata
  • menufilter: espressione regolare per la visualizzazione del menu
Sintassi XML:

<treeXML typeobj="tree" dsobj="ds" width="autosize" height="autosize" oncontextmenu="true">
    <contextmenu>
        <menu menuname="Value1" menufunction="function1" menufilter="^file$"/>
        <menu menuname="Value2" menufunction="function2" menufilter="^[a-zA-Z]{0}$"/>
        <menu menuname="Value3" menufunction="function3" menufilter="^[a-zA-Z]{0}$"/>
        <menu menuname="Value4" menufunction="function4" menufilter="^gridds$"/>
    </contextmenu>
</treeXML>
Sintassi JS:

function function1(node)
{
    AJAX.request("POST", "page.php", "data=custom_function&key="+node.key, false, true);
}
function function2(node)
{
    if (name = prompt("
Nome Directory:")) AJAX.request("POST", "page.php", "data=makedir&key="+node.key+"&name="+name, false, true);
}
function function3(node)
{
    AJAX.request("
POST", "page.php", "data=custom_function&key="+node.key, false, true);
}
function function4(node)
{
    AJAX.request("
POST", "page.php", "data=custom_function&key="+node.key, false, true);
}