Ext.grid.Panel - 행 데이터에 액세스하는 방법

Question

dblclick에 대한 수신기가있는 Ext.grid.Panel이 있습니다. 다음과 같이 보입니다 :

listeners: { 
    dblclick: { 
     fn : function() { 

       console.log("double click event processed"); 
     }, 
     element: 'el' 
    }     
} 

행을 더블 클릭하면 새 페이지에서 URL을 열고 싶습니다. URL을 결정하려면 행 데이터 (Panel의 저장소 역할을하는 JSON의 "행")에 대한 액세스가 필요합니다. 이 데이터에 어떻게 액세스합니까?

Answer 1

음, 이벤트는 itemdblclick (dblclick 없음)입니다. 그리고 행은 핸들러에 인수로 전달됩니다. 예를 들어

, 후속 샘플에서 때 당신은 경고 팝업 창이 선택한 심슨의 이름을 표시 볼 수있는 행을 더블 클릭 :

이

Ext.create('Ext.data.Store', { 
    storeId:'simpsonsStore', 
    fields:['name', 'email', 'phone'], 
    data:{'items':[ 
     { 'name': 'Lisa', "email":"lisa@simpsons.com", "phone":"555-111-1224" }, 
     { 'name': 'Bart', "email":"bart@simpsons.com", "phone":"555-222-1234" }, 
     { 'name': 'Homer', "email":"home@simpsons.com", "phone":"555-222-1244" }, 
     { 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254" } 
    ]}, 
    proxy: { 
     type: 'memory', 
     reader: { 
      type: 'json', 
      root: 'items' 
     } 
    } 
}); 

Ext.create('Ext.grid.Panel', { 
    title: 'Simpsons', 
    store: Ext.data.StoreManager.lookup('simpsonsStore'), 
    columns: [ 
     { text: 'Name', dataIndex: 'name' }, 
     { text: 'Email', dataIndex: 'email', flex: 1 }, 
     { text: 'Phone', dataIndex: 'phone' } 
    ], 
    height: 200, 
    width: 400, 
    listeners: { 
     itemdblclick: { 
      fn : function(grid, record) { 
       alert(record.get('name')); 
      } 
     } 
    },     

    renderTo: Ext.getBody() 
});​ 

또한 여기서 일을 볼 수 있습니다 http://jsfiddle.net/lontivero/utjyd/1/를

행운을 빈다.