customized right-click menu based on id

•

What is DaniWeb IT Discussion Community?

You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 392,316 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,952 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.

Join our community!

Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting

Thread Tools Display Modes

Views: 2818 | Replies: 9 | Solved

Previous Post in Thread

Next Post in Thread

•

Join Date: Apr 2006

Posts: 5

Reputation: Razorholt is an unknown quantity at this point

Rep Power: 0

Solved Threads: 0

Razorholt

Offline

Newbie Poster

customized right-click menu based on id

Apr 30th, 2006

Hello everyone,

I'm trying to customize the popup menu based on which table I right-click on. I have disabled the right-click function on the page except for the tables. I did this on purpose. This web page will be called from a python software, using the IE activeX, so no worries here about the browser compatibility.

I just don't know how to get the variable from showmenuie5(getid) and transfer it to the menu

Thank you very much for your help.

- Dan

Help with Code Tags

(Toggle Plain Text)

<html>
<head>
<script type="text/javascript"> 
// no right-click
function clickIE() { if (document.all) { }} function clickNS(e) { if (document.layers||(document.getElementById&&!document.all)) { if (e.which==2||e.which==3) {}}} if (document.layers) { document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS; } else { document.onmouseup=clickNS;document.oncontextmenu=clickIE; } document.oncontextmenu=new Function("return false") 
// popup menu
var menuskin = "skin1";
var display_url = 0;
function showmenuie5(getid) {
var rowid = getid
var rightedge = document.body.clientWidth-event.clientX;
var bottomedge = document.body.clientHeight-event.clientY;
if (rightedge < ie5menu.offsetWidth)
ie5menu.style.left = document.body.scrollLeft + event.clientX - ie5menu.offsetWidth;
else
ie5menu.style.left = document.body.scrollLeft + event.clientX;
if (bottomedge < ie5menu.offsetHeight)
ie5menu.style.top = document.body.scrollTop + event.clientY - ie5menu.offsetHeight;
else
ie5menu.style.top = document.body.scrollTop + event.clientY;
ie5menu.style.visibility = "visible";
return false;
}
function hidemenuie5() {
ie5menu.style.visibility = "hidden";
}
function highlightie5() {
if (event.srcElement.className == "menuitems") {
event.srcElement.style.backgroundColor = "highlight";
event.srcElement.style.color = "white";
if (display_url)
window.status = event.srcElement.url;
   }
}
function lowlightie5() {
if (event.srcElement.className == "menuitems") {
event.srcElement.style.backgroundColor = "";
event.srcElement.style.color = "black";
window.status = "";
   }
}
function jumptoie5() {
if (event.srcElement.className == "menuitems") {
if (event.srcElement.getAttribute("target") != null)
window.open(event.srcElement.url, event.srcElement.getAttribute("target"));
else
window.location = event.srcElement.url;
   }
}
</SCRIPT> 
<div id="ie5menu" class="skin0" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5();">
<div class='menuitems' url='countrypage.php?id= + rowid + '>Country page</div>
<div class='menuitems' url='add2fav.php?id= + rowid + '>Add to favorite</div>
</div>
<style type="text/css">
<!-- 
.skin1 {
cursor:default;
font:menutext;
position:absolute;
text-align:left;
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
width:120px;
background-color:menu;
border:1 solid buttonface;
visibility:hidden;
border:2 outset buttonhighlight;
}
.menuitems {
padding-left:15px;
padding-top:5px;
padding-bottom:5px;
padding-right:10px;
}
-->
</style>
</head><body bgcolor="#004f00">
<br><script language="JavaScript1.2">
if (document.all && window.print) {
ie5menu.className = menuskin;
document.body.onclick = hidemenuie5;
} </script>
<table id='table1' width="518" height='36' cellpadding="0" cellpadding="0" onmousedown="if(window.event.button==2) { showmenuie5('1'); }"><tr><td valign="middle" id="td1"><font onmouseover="cursor:'hand';" face="Arial" color="#cddecc" size=3><b>Row 1</b> -   Canada </font></td></tr></table>
<table id='table2' width="518" height='36' cellpadding="0" cellpadding="0" onmousedown="if(window.event.button==2) { showmenuie5('2'); }"><tr><td valign="middle" id="td2"><font onmouseover="cursor:'hand';" face="Arial" color="#cddecc" size=3><b>Row 2</b> -   USA </font></td></tr></table>
<table id='table3' width="518" height='36' cellpadding="0" cellpadding="0" onmousedown="if(window.event.button==2) { showmenuie5('3'); }"><tr><td valign="middle" id="td3"><font onmouseover="cursor:'hand';" face="Arial" color="#cddecc" size=3><b>Row 3</b> -   New Zealand </font></td></tr></table>
</body></html>

<html>
<head>
<script type="text/javascript"> 
// no right-click
function clickIE() { if (document.all) { }} function clickNS(e) { if (document.layers||(document.getElementById&&!document.all)) { if (e.which==2||e.which==3) {}}} if (document.layers) { document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS; } else { document.onmouseup=clickNS;document.oncontextmenu=clickIE; } document.oncontextmenu=new Function("return false") 
// popup menu
var menuskin = "skin1";
var display_url = 0;
function showmenuie5(getid) {
var rowid = getid
var rightedge = document.body.clientWidth-event.clientX;
var bottomedge = document.body.clientHeight-event.clientY;
if (rightedge < ie5menu.offsetWidth)
ie5menu.style.left = document.body.scrollLeft + event.clientX - ie5menu.offsetWidth;
else
ie5menu.style.left = document.body.scrollLeft + event.clientX;
if (bottomedge < ie5menu.offsetHeight)
ie5menu.style.top = document.body.scrollTop + event.clientY - ie5menu.offsetHeight;
else
ie5menu.style.top = document.body.scrollTop + event.clientY;
ie5menu.style.visibility = "visible";
return false;
}
function hidemenuie5() {
ie5menu.style.visibility = "hidden";
}
function highlightie5() {
if (event.srcElement.className == "menuitems") {
event.srcElement.style.backgroundColor = "highlight";
event.srcElement.style.color = "white";
if (display_url)
window.status = event.srcElement.url;
   }
}
function lowlightie5() {
if (event.srcElement.className == "menuitems") {
event.srcElement.style.backgroundColor = "";
event.srcElement.style.color = "black";
window.status = "";
   }
}
function jumptoie5() {
if (event.srcElement.className == "menuitems") {
if (event.srcElement.getAttribute("target") != null)
window.open(event.srcElement.url, event.srcElement.getAttribute("target"));
else
window.location = event.srcElement.url;
   }
}
</SCRIPT> 
<div id="ie5menu" class="skin0" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5();">
<div class='menuitems' url='countrypage.php?id= + rowid + '>Country page</div>
<div class='menuitems' url='add2fav.php?id= + rowid + '>Add to favorite</div>
</div>
<style type="text/css">
<!-- 
.skin1 {
cursor:default;
font:menutext;
position:absolute;
text-align:left;
font-family: Arial, Helvetica, sans-serif;
font-size: 10pt;
width:120px;
background-color:menu;
border:1 solid buttonface;
visibility:hidden;
border:2 outset buttonhighlight;
}
.menuitems {
padding-left:15px;
padding-top:5px;
padding-bottom:5px;
padding-right:10px;
}
-->
</style>
</head><body bgcolor="#004f00">
<br><script language="JavaScript1.2">
if (document.all && window.print) {
ie5menu.className = menuskin;
document.body.onclick = hidemenuie5;
} </script>
<table id='table1' width="518" height='36' cellpadding="0" cellpadding="0" onmousedown="if(window.event.button==2) { showmenuie5('1'); }"><tr><td valign="middle" id="td1"><font onmouseover="cursor:'hand';" face="Arial" color="#cddecc" size=3><b>Row 1</b> -   Canada </font></td></tr></table>
<table id='table2' width="518" height='36' cellpadding="0" cellpadding="0" onmousedown="if(window.event.button==2) { showmenuie5('2'); }"><tr><td valign="middle" id="td2"><font onmouseover="cursor:'hand';" face="Arial" color="#cddecc" size=3><b>Row 2</b> -   USA </font></td></tr></table>
<table id='table3' width="518" height='36' cellpadding="0" cellpadding="0" onmousedown="if(window.event.button==2) { showmenuie5('3'); }"><tr><td valign="middle" id="td3"><font onmouseover="cursor:'hand';" face="Arial" color="#cddecc" size=3><b>Row 3</b> -   New Zealand </font></td></tr></table>
</body></html>