TafelTree-view (Javascript)
Treeview basé sur la libraire Script Aculous
FAQ
Quelles sont les options que je peux mettre dans le constructeur ?
Voici les paramètres et les valeurs possibles :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49
<script type="text/javascript">
var tree = new TafelTree("idTree", myJSONstruct, {
"generate" : true,
"imgBase" : "imgs/",
"width" : "300px", // default : 100%
"height" : "250px", // default : auto
"defaultImg" : "page.gif",
"defaultImgOpen" : "folderopen.gif",
"defaultImgClose" : "folder.gif",
"defaultImgSelected" : "page.gif",
"defaultImgOpenSelected" : "folderopen.gif",
"defaultImgCloseSelected" : "folder.gif",
"onLoad" : myFuncLoad,
"onDebug" : myFuncDebug,
"onCheck" : myFuncCheck,
"onBeforeCheck" : myFuncBeforeCheck,
"onClick" : myFuncClick,
"onDblClick" : myFuncDblClick,
"onBeforeOpen" : myFuncBeforeOpen,
"onOpen" : myFunconOpen,
"onMouseOver" : myFuncMouseOver,
"onMouseOut" : myFuncMouseOut,
"onMouseDown" : myFuncMouseDown,
"onMouseUp" : myFuncMouseUp,
"onDrop" : myFuncDrop,
"onEdit" : myFuncEdit,
"onEditAjax" : [myFuncEditAjax, "server/edit.php"],
"onDropAjax" : [myFuncDropAjax, "server/drop.php"]
"onOpenPopulate" : [myFuncOpenPopulate, "server/open.php"],
"multiline" : false,
"checkboxes" : false,
"checkboxesThreeState" : false,
"cookies" : true,
"openOneAtOnce" : false,
"openAtLoad" : true,
"openAfterAdd" : true,
"showSelectedBranch" : true,
"lineStyle" : "line", // line, full, none
"rtlMode" : false,
"dropALT" : true,
"dropCTRL" : false,
"propagateRestriction" : true,
"reopenFromServer" : true,
"behaviourDrop" : "child", // ou sibling, childcopy, siblingcopy
"bind" : [treeToBind, otherTree], // Object(s) TafelTree
"bindAsUnidirectional" : [treeToBind2] // Object(s) TafelTree
});
</script>
Et dans une branche, je peux mettre quoi ?
Voici les paramètres et les valeurs possibles pour une branche :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58
<script type="text/javascript">
var branch = {
// Propriétés obligatoires
"id" : "branchID",
"txt" : "Branch text",
// Sous-branches
"items" : {...la description de branches...},
// Propriétés diverses
"img" : "page.gif",
"imgopen" : "folderopen.gif",
"imgclose" : "folder.gif",
"imgselected" : "page.gif",
"imgopenselected" : "folderopen.gif",
"imgcloseselected" : "folder.gif",
"acceptdrop" : true,
"draggable" : true,
"check" : 1,
"editable" : false,
"last" : false,
"open" : true,
"style" : "cssStyleName",
"title" : "Un attribut title",
"tooltip" : "<h4>Un tooltip HTML</h4>",
// Les propriétés de "fonction"
"onbeforecheck" : myFunc1,
"oncheck" : myFunc2,
"onbeforeopen" : myFunc3,
"onopen" : myFunc4,
"onedit" : myFunc5,
"ondrop" : myFunc6,
"onclick" : myFunc7,
"ondblclick" : myFunc8,
"onmouseover" : myFunc9,
"onmouseout" : myFunc10,
"onmousedown" : myFunc11,
"onmouseup" : myFunc12,
"onerrorajax" : myFunc13,
// Drop ajax
"ondropajax" : myFunc14,
"droplink" : "drop.php",
// Open ajax
"onopenpopulate" : myFunc15,
"openlink" : "open.php",
"canhavechildren" : true,
// Edit ajax
"oneditajax" : myFunc16,
"editlink" : "edit.php",
// Propriétés personnalisés
"maString" : "salut",
"monBool" : false,
"monInt" : 125,
"monTableau" : ["hop", "et rehop"],
"maFonction" : function(){alert("cool");},
"monObjet" : {"propriete1":1,"propriete2":112},
"nImporteQuoiDautre" : true
};
</script>
Voici les paramètres et les valeurs possibles :
|
|
Voici les paramètres et les valeurs possibles pour une branche :
|
|
Choix des langues
Téléchargement
Télécharger la version v1.9.1
Documentation
Une documentation complète est accessible ici
Smarty
Un module Smarty a été développé pour l'arbre. Merci à Abalam! Module smarty
Ils l'utilisent
Treeview JS TafelTree
2007-07-23, Tafel. Optimisé pour Mozilla Firefox