셀 컨텍스트 메뉴에서 (향상된 -) 그리드 셀 데이터에 액세스하는 방법?

Question

내 웹 응용 프로그램은 dojo 1.6.0을 기반으로합니다. 내가 가지고있는 문제는 기본적으로 dojos "dojox.grid.EnhancedGrid"라이브러리의 이벤트 처리기 및/또는 해당 활용도를 기반으로합니다.

내 응용 프로그램에 행 수가 많은 dojox Enhanced Grid가 포함되어 있습니다. (100+)

이 향상된 그리드는 "cellMenu"- 플러그인을 사용하여 마우스 오른쪽 버튼을 클릭하면 각 그리드 셀에 대해 컨텍스트 메뉴 을 표시합니다.

제 목표는 행을 "스마트하게"선택하기 위해 컨텍스트 메뉴를 사용하는 것입니다. 예를 들어

:

사용자는 오른쪽 셀 느릅 클릭

가 "LASTNAME"란에 위치되고 값 "밀러"를 갖는다. 그런 다음 컨텍스트 메뉴에서 "스마트 선택"을 클릭합니다. 그러면 응용 프로그램에서 행 데이터를 반복하여 "밀러"가 "성"인 모든 행을 선택합니다. 여파로 사용자는 버튼을 눌러 선택한 행으로 작업을 시작합니다. 여기

컨텍스트 메뉴 향상된 격자의 시각화를위한 선언적 방식을 나타내는 작은 소스 코드 예이다 :

<table dojoType="dojox.grid.EnhancedGrid" plugins="{cellMenu:'myMenu'}"> 
<div id="myMenu" dojoType="dijit.Menu"> 
    <div id="mi1" dojoType="dijit.MenuItem">Do something with this cell</div> 
    <div id="mi2" dojoType="dijit.MenuItem">Do something else with this cell</div> 
</div> 
<thead> 
    definition of columns 
</thead> 
</table> 

액션 코드에 시각화 별도로 처리 JS-파일 :

<script type="text/javascript"> 
dojo.addOnLoad(function(){ 
    dojo.connect(dijit.byId('mi1'),'onClick',function(event){ 
    //Use Data from the cell clicked to do something 
    }); 
    dojo.connect(dijit.byId('mi2'),'onClick',function(event){ 
    //Use Data from the cell clicked to do something else 
    }); 
}); 
</script> 

나는 비교적 새로운 dojo이며 EnhancedGrid를 다루는 데 경험이 없다.

그래서 내 문제는 다음

내가 트리거 안에 포함 된 "dijit.MenuItem"의 "dijit.Menu"는 "온 클릭"이벤트 이다 컨텍스트 메뉴 내부를 클릭합니다.

문맥 메뉴 가 열린 "Grid Cell"의 내용을 읽어야하지만 "그리드"에 대한 참조를 얻는 방법이 없습니다 (또는 현재 알지 못합니다). 세포".

기본 전술을 사용하면 MenuItem에 대한 참조를 가져올 수 있고 거기에서 Menu로 이동할 수는 있지만 "Grid Cell"또는 행/열 ID에 대한 참조가 포함 된 특성을 찾을 수 없습니다. 클릭 한 셀에 액세스 할 수있게 해줍니다.

마우스 오른쪽 버튼으로 클릭하면 열 수있는 "항목"으로 컨텍스트 메뉴가 있기 때문에이 "항목"에 액세스하는 방법 (디자이너가 의미하는대로)이 있어야한다고 생각합니다.

아직 문서 또는 예제를 발견하지 못했지만 모든 도움을 주셔서 감사합니다.

Answer 1

는 선택 목적으로 도장 그리드에 상황에 맞는 메뉴를 사용 가능한 sollution (아마도 가장이되지 않음)입니다

// Stylesheets and Dojo Groundwork are neglected in this example 

<script type="text/javascript"> 
    dojo.require('dijit.Menu'); 
    dojo.require('dijit.MenuItem'); 
    dojo.require('dojox.grid.EnhancedGrid'); 
    dojo.require('dojox.grid.enhanced.plugins.IndirectSelection'); 
    dojo.require('dojox.grid.enhanced.plugins.Menu'); 

    var currentEvent = null; 

    var fn_selectSimilar = function(){ 
    var data = currentCell.grid.store.objectStore.data; 
    dojo.forEach(data,function(row,idx){ 
     if(row[currentEvent.cell.field] == data[currentEvent.rowIndex][currentEvent.cell.field]){ 
     currentEvent.cell.grid.selection.addToSelection(idx); 
     } 
    } 
    } 
    var fn_deSelectSimilar = function(){ 
    var data = currentEvent.cell.grid.store.objectStore.data; 
    dojo.forEach(data,function(row,idx){ 
     if(row[currentEvent.cell.field] == data[currentEvent.rowIndex][currentEvent.cell.field]){ 
     currentEvent.cell.grid.selection.deselect(idx); 
     } 
    } 
    } 

    dojo.addOnLoad(function(){ 
    dojo.connect(dijit.byId('grid'),"onCellContextMenu",function(e){ 
     currentEvent = e; 
    }); 
    dojo.connect(dijit.byId('mi_selectSimilar'),"onClick",fn_selectSimilar); 
    dojo.connect(dijit.byId('mi_deSelectSimilar'),"onClick",fn_deSelectSimilar); 
    }); 

</script> 

Answer 2

이것은 그리드의 모든 선택된 항목을 거쳐 "YourGridColumnName"이라는 셀의 값을 가져옵니다.

var items = YourDataGridId.selection.getSelected(); 
if (items.length) { 
    dojo.forEach(items, function(selectedItem) { 
     alert(YourDataGridId.store.getValues(selectedItem, "YourGridColumnName")); 
    }) 
} 

희망이 있습니다.

Answer 3

이벤트 핸들러를 컨텍스트 메뉴를 불러올 마우스 및 키보드 이벤트에 연결할 수 있습니다.이벤트에는 메뉴 항목이 찾을 수있는 위치에 저장할 수있는 행 인덱스가 있습니다.

비주얼 부 (선언)

<table id="grid" dojoType="dojox.grid.EnhancedGrid" 
    plugins="{indirectSelection:true,menus:{cellMenu:'GridCellMenu'}}"> 
    <div dojoType="dijit.Menu" id="GridCellMenu" style="display:none;"> 
    <div dojoType="dijit.MenuItem" id="mi_selectSimilar">select similar items</div> 
    <div dojoType="dijit.MenuItem" id="mi_deSelectSimilar">DEselect similar items</div> 
    </div> 
    <thead> 
    <tr> 
     <th field="id">ID</th> 
     <th field="lastname">Lastname</th> 
     <th field="firstname>firstname</th> 
    </tr> 
    </thead> 
</table> 

자바 스크립트 배경

: 여기