현대의 그리드에서 선택된 항목 가져 오기

Question

컨트롤러에서 "선택한 항목이있는 항목을 그리드"로해야합니다.

지금 문제는 다음과 같다

let orderGridComponent = Ext.ComponentQuery.query('ordergrid[itemId=ordergrid]')[0]; 

가 작동 : 어떤 방법 나는 단순히 전화 그리드를 얻으려면 선택

을 얻을 수없는 것보십시오. 지금은 간단하게 할 수있는 documentation에 따라 선택을 얻을 :

let selection = orderGridComponent.selection; 

을 선택 "널 (null)"항상 그러나. 그리드는 다음과 같이 정의된다

Ext.define('myApp.view.main.OrderGrid', { 
    extend: 'Ext.grid.Grid', 
    xtype: 'ordergrid', 


    columnLines: true, 

    selectable: { 
     rows: true, 
     cells: false 
    }, 

    requires: [ 
     'myApp.store.OrderStore' 
    ], 

    title: 'Order data', 

    store: { 
     type: 'orders' 
    }, 

    columns: [ 
    { 
     xtype: 'checkcolumn', 
     headerCheckbox: true, 
     dataIndex: 'selected' 
    }, { 
     text: 'Order Nr', 
     dataIndex: 'orderNr', 
     width: 100, 
     flex: 1 
    }] 
}); 

내가 다른 내선 버전에 대한 인터넷의 주위에 제안 할 것으로 보인다 let selection = orderGridComponent.selected 또는 getSelected 및 많은 많은 변종을 시도했습니다

{ 
     xtype: 'ordergrid', 
     itemId: 'ordergrid', 
    } 

으로 사용.

이렇게하려면 6.5.2 프레임 워크에서 어떻게해야합니까?

Answer 1

선택한 레코드를 얻으려면 grid.getSelection() 메서드를 사용해야합니다.

이 FIDDLE에서 나는 grid을 사용하여 데모를 만들었습니다. 귀하의 요구 사항을 달성하는 데 도움이되기를 바랍니다.

코드 조각

var store = Ext.create('Ext.data.Store', { 
    fields: ['name', 'email', 'selected'], 
    data: [{ 
     name: 'a', 
     email: 'a@abc.com', 
     selected: false 
    }, { 
     name: 'b', 
     email: 'b@abc.com', 
     selected: false 
    }] 
}); 

Ext.create('Ext.Panel', { 
    title: 'Get Selection', 
    renderTo: Ext.getBody(), 
    fullscreen: true, 
    viewModel: { 
     selection: null, 
     count: 0 
    }, 
    items: [{ 
     xtype: 'grid', 
     selectable: { 
      mode: 'multi', 
      checkbox: true 
     }, 
     store: store, 
     columns: [{ 
      text: 'Name', 
      flex: 1, 
      dataIndex: 'name' 
     }, { 
      text: 'Email', 
      flex: 1, 
      dataIndex: 'email' 
     }], 
     height: 200, 
     listeners: { 
      selectionchange: function (grid, re) { 
       var selection = grid.getSelections(), 
        data = null, 
        vm = grid.up('panel').getViewModel(); 

       if (!Ext.isEmpty(selection)) { 
        data = selection.map(rec => { 
         return rec.get('name') 
        }).join(','); 
       } 
       vm.set('selection', data); 
      } 
     } 
    }], 
    bbar: ['->', { 
     xtype: 'label', 
     bind: { 
      html: 'seleted user name is <b>{selection}</b>' 
     } 
    }] 
})