[phpBB Debug] PHP Notice: in file /includes/bbcode.php on line 112: preg_replace(): The /e modifier is no longer supported, use preg_replace_callback instead
www.dhtmlgoodies.com • View topic - Context menu on a folder tree
Page 1 of 1

Context menu on a folder tree

PostPosted: Mon Jan 22, 2007 5:36 pm
by FickD

PostPosted: Fri Oct 19, 2007 10:18 am
by saJoshua
I'm doing the exact same thing.

Note that my body tag has the oncontextmenu like this to prevent the browser's context menu appearing:
<body oncontextmenu="return false;">


hope it helps.

<ul id="menuModel2" style="display:none; z-index:1000;">
<li id="1500022" jsFunction="viewEditNode(this);"><a href="#">View / Edit Information</a></li>
</ul>

<script type="text/javascript">
// <%GetExplorerTree();%>
// get the nodes in JSON style
// The above will output the following -->
var arrTreeNodes = [
{l:'2',V:'2_3',pV:'',t:'absa jhb',img:'Site'},
{l:'3',V:'3_19',pV:'2_3',t:'areamanager',img:'Department'},
{l:'3',V:'3_20',pV:'2_3',t:'branchmanager',img:'Department'},
{l:'3',V:'3_21',pV:'2_3',t:'broker',img:'Department'},
{l:'3',V:'3_22',pV:'2_3',t:'cleaner',img:'Department'},
{l:'3',V:'3_23',pV:'2_3',t:'consultant',img:'Department'},
{l:'3',V:'3_24',pV:'2_3',t:'corp teller',img:'Department'},
{l:'3',V:'3_25',pV:'2_3',t:'enquiries',img:'Department'},
{l:'3',V:'3_26',pV:'2_3',t:'host',img:'Department'},
{l:'3',V:'3_27',pV:'2_3',t:'sales manager',img:'Department'},
{l:'3',V:'3_28',pV:'2_3',t:'sales reseption',img:'Department'},
{l:'3',V:'3_29',pV:'2_3',t:'sales support',img:'Department'},
{l:'3',V:'3_30',pV:'2_3',t:'smallbusiness',img:'Department'},
{l:'3',V:'3_31',pV:'2_3',t:'spare',img:'Department'},
{l:'3',V:'3_32',pV:'2_3',t:'switchboard',img:'Department'},
{l:'3',V:'3_33',pV:'2_3',t:'tellers',img:'Department'},
{l:'3',V:'3_34',pV:'2_3',t:'treasury',img:'Department'},
{l:'3',V:'3_18',pV:'2_3',t:'unassigned department',img:'Department'},
{l:'4',V:'4_87',pV:'3_18',t:'unassigned user',img:'User'},
{l:'4',V:'4_110',pV:'3_19',t:'barry siewertsen',img:'User'},
{l:'4',V:'4_133',pV:'3_20',t:'glynnis campher',img:'User'},
{l:'4',V:'4_61',pV:'3_21',t:'lionel baron',img:'User'},
{l:'4',V:'4_36',pV:'3_22',t:'ursula ',img:'User'},
{l:'4',V:'4_12',pV:'3_23',t:'charlin adams',img:'User'},
{l:'4',V:'4_73',pV:'3_23',t:'claudine williams',img:'User'},
{l:'4',V:'4_72',pV:'3_23',t:'fatima pasha',img:'User'},
{l:'4',V:'4_18',pV:'3_23',t:'francois damons',img:'User'},
{l:'4',V:'4_65',pV:'3_23',t:'johannes neels',img:'User'},
{l:'4',V:'4_43',pV:'3_23',t:'verina herwitz',img:'User'},
{l:'4',V:'4_67',pV:'3_24',t:'clive scheepers',img:'User'},
{l:'4',V:'4_42',pV:'3_25',t:'abongile dlangalavu',img:'User'},
{l:'4',V:'4_107',pV:'3_25',t:'faika splinters',img:'User'},
{l:'4',V:'4_94',pV:'3_25',t:'lizelle hermanus',img:'User'},
{l:'4',V:'4_59',pV:'3_25',t:'lulama xatyana',img:'User'},
{l:'4',V:'4_111',pV:'3_25',t:'shireen reid-isaacs',img:'User'},
{l:'4',V:'4_104',pV:'3_25',t:'sinothando mkiva',img:'User'},
{l:'4',V:'4_116',pV:'3_25',t:'theodora dyamara',img:'User'},
{l:'4',V:'4_5',pV:'3_26',t:'justice khohlokoane',img:'User'},
{l:'4',V:'4_85',pV:'3_27',t:'andrew pitout',img:'User'},
{l:'4',V:'4_66',pV:'3_28',t:'geraldine gillion',img:'User'},
{l:'4',V:'4_69',pV:'3_29',t:'yoliswa ngeshe',img:'User'},
{l:'4',V:'4_29',pV:'3_30',t:'tertia january',img:'User'},
{l:'4',V:'4_62',pV:'3_31',t:'spare 004',img:'User'},
{l:'4',V:'4_137',pV:'3_32',t:'fatima barendse',img:'User'},
{l:'4',V:'4_17',pV:'3_33',t:'athur miles',img:'User'},
{l:'4',V:'4_96',pV:'3_33',t:'bathi magwentshu',img:'User'},
{l:'4',V:'4_86',pV:'3_33',t:'clayton pieterse',img:'User'},
{l:'4',V:'4_30',pV:'3_33',t:'ismail bartlett',img:'User'},
{l:'4',V:'4_95',pV:'3_33',t:'lynne lubbe',img:'User'},
{l:'4',V:'4_38',pV:'3_33',t:'michelle schrikker',img:'User'},
{l:'4',V:'4_52',pV:'3_33',t:'nombulelu bottoman',img:'User'},
{l:'4',V:'4_123',pV:'3_33',t:'pam solomons',img:'User'},
{l:'4',V:'4_75',pV:'3_33',t:'tashreeka levy',img:'User'},
{l:'4',V:'4_88',pV:'3_33',t:'yumna adams',img:'User'},
{l:'4',V:'4_79',pV:'3_34',t:'desiree alexander',img:'User'},
{l:'4',V:'4_31',pV:'3_34',t:'melanie paulse',img:'User'}
];




for(var nodeCount = 0; nodeCount < arrTreeNodes.length; nodeCount++){
addNode(arrTreeNodes[nodeCount].l,arrTreeNodes[nodeCount].t,arrTreeNodes[nodeCount].V,arrTreeNodes[nodeCount].pV,arrTreeNodes[nodeCount].img)
}

var myTree;
// l = arbitrary value telling me an internal heirarchy value
// t = text of the node
// V = value of the node
// pV = value of the parent node
// img = name of image to use
function addNode(l,t,V,pV,img){
try
{
if(!myTree)myTree = $('myTree');
var li = document.createElement('li');
var a = document.createElement('a');
a.innerHTML = t;
li.appendChild(a);
li.id = V;
li.setAttribute("Im",img + '.gif');
addEvent(li,'contextmenu',showContextMenu);

if(!pV || pV.toLowerCase() == "\'null\'" || pV == ""){
li.setAttribute("noDrag","true");
myTree.appendChild(li);
return;
}else{
if(l=="5")li.setAttribute("noSiblings","true");
var p = $(pV);
if(p.length)p = p[0];
var ul = p.getElementsByTagName('ul');
if(ul.length){
// if there is a UL on the parent already, use that one.
ul = ul[0];
}else{
// otherwise create the UL on the parent.
ul = document.createElement('ul');
p.appendChild(ul);
}
// append to the parent's UL;
ul.appendChild(li);
}
}
catch(e){
var s = e;
alert(s);
var s = "";
}
}

treeObj = new DHTMLSuite.JSDragDropTree();
treeObj.setTreeId('myTree');
treeObj.init();
treeObj.collapseAll();

if(!myTree)myTree = $('myTree');
for(var i = 0; i < myTree.childNodes.length; i++){
if(myTree.childNodes[i].id){
treeObj.showHideNode(false, myTree.childNodes[i].id);
}
}

var menuModel2 = new DHTMLSuite.menuModel();
menuModel2.addItemsFromMarkup('menuModel2');
menuModel2.init();

/* Only one contextMenu object per page */
var contextMenu = new DHTMLSuite.contextMenu();
contextMenu.setWidth(200);
contextMenu.attachTo(document.getElementById('myTree'),menuModel2);

function showContextMenu(e){
var src = getSrc(e);
while(src.tagName && src.tagName.toLowerCase() != "li" && src.parentNode)
src = src.parentNode;

$('hidClickedContextLi').innerHTML = src.id;
return true;
}

function viewEditNode(){
var src = $('hidClickedContextLi').innerHTML;
if(!src)return false;
var id = src.substr(2);
switch(src.substr(0,1)){
case "2": // Sites
paneSplitter.deleteContentById('UpdateSites');
openPage('center','UpdateSites','Common/includes/_Update_Sites.aspx?id='+id,'UpdateSites','UpdateSites');
break;
case "3": // Departments
paneSplitter.deleteContentById('UpdateDepartments');
openPage('center','UpdateDepartments','Common/includes/_Update_Departments.aspx?id='+id,'UpdateDepartments','UpdateDepartments');
break;
case "4": // Users
paneSplitter.deleteContentById('UpdateUsers');
openPage('center','UpdateUsers','Common/includes/_Update_Users.aspx?id='+id,'UpdateUsers','UpdateUsers');
break;
}
}

function getSrc(evt)
{
if (!evt) var evt = window.event;
if(is_ie)
{
return event.srcElement
}
return evt.target;
}
function $(id)
{
return document.getElementById(id);
}
function addEvent(o,e,f){
if (o.addEventListener){ o.addEventListener(e,f,false); return true; }
else if (o.attachEvent){ return o.attachEvent("on"+e,f); }
else { return false; }
}
</script>

PostPosted: Fri Oct 19, 2007 10:21 am
by saJoshua
PS..

to have custom images, change the DHTML library like this:

if(menuItems[no].className){
folderImg.src = DHTMLSuite.configObj.imagePath + 'drag-drop-tree/' + (menuItems[no].getAttribute('Im') || menuItems[no].className);
}else{
folderImg.src = DHTMLSuite.configObj.imagePath + 'drag-drop-tree/' + (menuItems[no].getAttribute('Im') || this.folderImage);
}

and have the images in the correct folder in your selected themes' drag-drop-tree folder.