plugin GIJGO Drag & Drop treeview et contextmenu
Bonjour à tous,
Je rencontre un problème avec l'utilisation conjointe de ces 2 librairies :
https://swisnl.github.io/jQuery-contextMenu/
https://gijgo.com/tree
Je génère un arbre hiérarchique du personnel d'une entreprise pour cela j'utilise gijgo treeview
Code:
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
| tree = $('#tree').tree({
uiLibrary : 'bootstrap',
dataSource : ctxPth + '/divisions/get?getUsers=true',
primaryKey: 'id',
dragAndDrop: true,
autoLoad: true
});
tree.on('nodeDrop', function(e, id ,parentId,orderNumber){
console.log("deplacement de " + id + " vers " + parentId)
if (id.includes("[USER]")){
$.ajax({
'url' : ctxPth + '/user/move',
'type' : 'GET',
'dataType' :'json',
'data' : 'userId=' + encodeURIComponent(id.split(']')[1]) + '&divId=' + encodeURIComponent(parentId.split(']')[1]),
'complete' : function(res, status){
}
});
} else if (id.includes("[DIV]")){
$.ajax({
'url' : ctxPth + '/divisions/move',
'type' : 'GET',
'dataType' :'json',
'data' : 'divId=' + encodeURIComponent(id.split(']')[1]) + '&parentDivId=' + encodeURIComponent(parentId.split(']')[1]),
'complete' : function(res, status){
}
});
}
});
tree.on('nodeDataBound', function(e, node,id, record){
// console.log(record);
if (record.id.includes("[USER]")){
node.addClass("context-menu-user")
} else if (record.id.includes("[DIV]")){
node.addClass("context-menu-div")
}
}); |
sur ces élments j'utilise contextMenu pour créer un menu contextuel
Code:
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
| $.contextMenu({
selector: 'li.context-menu-div',
callback:function(itemKey, opt){
console.log(itemKey);
},
hideOnSecondTrigger : true,
autoHide: true,
itemClickEvent : "click",
reposition : true,
items: {
"rename" :{
name:"Editer",
icon:"edit"
},
"newUser" :{
name:"Nouvel Utilisateur",
icon:"add"
},
"newDiv" :{
name:"Nouvelle Division",
icon:"add"
},
"delDiv" :{
name:"Supprimer",
icon:"delete"
}
}
}); |
Tout fonctionne (Drag an drop menus contextuels...) mais il y a un problème que je ne parviens pas a résoudre.
Lorsque l'option dragAndDrop du treeView est active, une action sur un élément du contextMenu agit également sur le node du treeview situé en desous de la position du curseur.
La même action que si le bouton de ma souris maintenait l'élément pour le déplacer.
Si quelqu'un a une piste, j'ai essayé tellement de combines, retourné les docs des composants, je rate surement quelque chose.
Merci.
