3.2.0

Right Click revisited

obj.setEvent("oncontextmenu", myRightClick);

has no effect, IE 6.0
Richard
February 3,
The below works for me in ie6 (and ff). It was a 15 minute proof of concept to see how one could identify the current cell from a right-click, select it and set options in a context menu so as to make a right click usefull. This is basically glued bits of code from dymanic drive and this forum


var table = new Active.XML.Table;
var grid = new Active.Controls.Grid;
Active.Templates.Text.prototype.setEvent("oncontextmenu", oncontextmenu);
    //	create data formats
    var string = new Active.Formats.String;
    //	create ActiveWidgets data model - XML-based table
    //	provide data URL
    table.setURL("://server/xml?");
    //set rows XPath
    table.setRows("//securities/*");
    //set columns XPath
    table.setColumns(["name","symbol", "currency", "priceDateRange"]);
    //set column formatting
    table.setFormats([string, string, null, string]);
    //start asyncronous data retrieval
    table.request();
    //define column labels
    var columns = ["Company Name", "Sym", "Curr", "Data Range"];
    //provide column labels
    grid.setColumnProperty("texts", columns);

    grid.setAction("contextmenu", function(src){doGridContextMenu(src);});    
    grid.setEvent("oncontextmenu", oncontextmenu);
    grid.setRowHeaderWidth("0px");    
    document.write(grid);

var rightedge=0;
var bottomedge=0;


//we get the event here so grab the xy of the cursor
function oncontextmenu(e){
    //disable the browser menu
   e.cancelBubble = true;
   e.returnValue = false;

   //Call the grid contextmenu handler so we can 
   //get cell specific stuff with the src arg
   this.action("contextmenu");
   
   //Grab the hidden menu
   var menuobj=document.getElementById("ctxMenu")
   rightedge=ie5? document.body.clientWidth-event.clientX : window.innerWidth-e.clientX
   bottomedge=ie5? document.body.clientHeight-event.clientY : window.innerHeight-e.clientY
   
    if (rightedge<menuobj.offsetWidth)
        //move the horizontal position of the menu to the left by it's width
        menuobj.style.left=ie5? document.body.scrollLeft+event.clientX-menuobj.offsetWidth : window.pageXOffset+e.clientX-menuobj.offsetWidth
    else
        //position the horizontal position of the menu where the mouse was clicked
        menuobj.style.left=ie5? document.body.scrollLeft+event.clientX : window.pageXOffset+e.clientX
    //same concept with the vertical position
    if (bottomedge<menuobj.offsetHeight)
        menuobj.style.top=ie5? document.body.scrollTop+event.clientY-menuobj.offsetHeight : window.pageYOffset+e.clientY-menuobj.offsetHeight
    else
        menuobj.style.top=ie5? document.body.scrollTop+event.clientY : window.pageYOffset+e.clientY

    //after determining the position, show context menu
    menuobj.style.visibility="visible"   
}    
    
//simple way to hide the context menu
function hideMyMenu(){
    document.getElementById('myMenu').style.display = 'none';
}    

function doGridContextMenu(src){
  setContext(src.getProperty("item/text") + " " + src.getProperty("item/index"));
  grid.setProperty("selection/index", src.getProperty("item/index"));
  var menuobj=document.getElementById("ctxMenu")
  //menuobj.??? set a key, add a submenu etc... src.getProperty("item/text")
}
Hatt
February 9,

This topic is archived.

See also:


Back to support forum