:: Forum >> Version 2 >>

context menu problem - V2

I'm having problems that when the context menu is triggered and you have a row selected that is off your current view, your view resets to where your selected row is before it shows the context menu. I tried resetting the selected row but to no avail. Currently, if you load this code and either have no row selected or select a row and then scroll away from it, then you right click with no selected row on the screen, the view will reset to the top (if nothing selected) or to the previously selected row.

Any ideas?

<html>
<
head>
  <
script src="/ActiveWidgets/runtime/lib/aw.js"></script>
  <
link href="/ActiveWidgets/runtime/styles/aqua/aw.css" rel="stylesheet"></link>
</
head>
<
body>
  <
style>
        
#contextmenu {
          
background-color#c0c0c0;
          
border2px solid;
          
border-color#f0f0f0 #909090 #909090 #f0f0f0;
          
left0px;
          
padding3px 3px 3px 3px;
          
positionabsolute;
          
top0px;
          
visibilityhidden;
          
z-index600;
        }
  </
style>

  <
script>
    var 
headers = [ 
                     
"header 1",
                     
"header 2",
                     
"header 3",
                     
"header 4",
                     
"header 5",
                     
"header 6",
                     
"header 7",
                     
"header 8",
                     
"header 9",
                     
"header 10",
                     
"header 11",
                     
"header 12",
                     
"header 13",
                     
"header 14",
                   ];

    var 
table = new AW.Grid.Extended;
    
table.setId('myGrid');
    
table.setStyle('height'300);                                                           
    
table.setStyle('width''90%');                                                          
    
table.setColumnCount(12);                                                                
    
table.setColumnIndices([0,13,1,3,5,6,4,2,7,8,9,10]);        
    
table.setHeaderText(headers);                                                            
    
table.setCellText(function(ij){return "-" i});                                   
    
table.setVirtualMode(true);                                                              
                                                                                             
    
table.setSelectorText(function(i){return this.getRowPosition(i)+1});                     
    
table.setSelectorVisible(true);                                                          
    
table.setSelectorResizable(true);                                                        
    
table.setHeaderHeight(20);                                                               
    
table.setSelectorWidth(25);                                                              
    
table.setRowCount(200);                                                                  
                                                                                             
    
table.setCellEditable(false); // disable editing                                         
    
table.setSelectionMode("multi-row");                                                     
                                                                                             
    
table.getCellTemplate().setEvent("oncontextmenu"raiseMenuEvent);                       
                                                                                             
    function 
raiseMenuEvent(event){                                                          
      
this.raiseEvent("onCellContextMenu"eventthis.\$0,this.\$1);                        
    }                                                                                        
                                                                                             
    var 
contextmenu = new AW.HTML.DIV;                                                       
    
contextmenu.setId('contextmenu');                                                        
    
document.write(contextmenu);                                                             
                                                                                             
    
table.onCellContextMenu = function(eventcolrow){                                     
      
contextmenu.element().innerHTML "Right Click Menu";                                  
      
table.setSelectedRows([row]);                                                          
      
contextmenu.setStyle('left'event.clientX "px");                                    
      
contextmenu.setStyle('top'event.clientY "px");                                     
      
contextmenu.setStyle("visibility""visible");                                         
    }                                                                                        
                                                                                             
    
document.onclick = function() { contextmenu.setStyle("visibility""hidden"); };         
    
document.write(table);                                                                   
  </
script>                                                                                  
</
body>                                                                                      
</
html>         
Mike
Monday, September 25, 2006
you could set the current row to the right clicked row before showing the menu. shouldn't that solve the problem? I also avoided the context menu since I found some issues with it. instead I just created a DIV layer and positioned it at the absolute position of the event x and y. the div then has a onmouseleave event tied to it to hide it.
Joel
Monday, September 25, 2006
just realized - the onmouseleave might not work outside of IE. not an issue for me but...
Joel
Monday, September 25, 2006
I tried the following but I still get the same problem:

// assign html event handler to row template
  
table.getCellTemplate().setEvent("oncontextmenu", function (event) {
    var 
row this.\$0;
    var 
col this.\$1;
    
table.setSelectedRows([row]);
    
this.raiseEvent("onCellContextMenu"eventrowcol);
  }); 
I'm not sure where to stick the row select to make it happen before the event.

Ideas?
Mike
Tuesday, September 26, 2006
yes - call setCurrentRow(row) before the raiseevent
Joel
Tuesday, September 26, 2006
Well, the setCurrentRow still moves the grid but it does at least keep me in the correct area of the list. I think this is still a bug and should be considered as to how to handle it in a better fashion. It looks to me to be a simple problem of operations not being in a good order when it comes to the event, selecting rows, etc.

Atm it appears to do:
event->move->select
should be:
event->select->move

It works like that for left click, but for right it seems backwards.

Thanks for the help!
Mike
Thursday, September 28, 2006



This topic is archived.

Back to support forum

Forum search