[英]Get selected items from a grid in sencha modern
In an application I create the controller needs to do "things with the selected items in a grid". 在我创建的应用程序中,控制器需要执行“将选定项目放在网格中的操作”。
Now the problem is: any way I try I can't seem to get the selection 现在的问题是:无论如何我尝试我似乎都无法获得选择
To get the grid I simply call: 要获取网格,我只需调用:
let orderGridComponent = Ext.ComponentQuery.query('ordergrid[itemId=ordergrid]')[0];
Which seems to work. 这似乎可行。 Now to get the selection according to the documentation I could simply do:
现在,根据文档即可进行选择:
let selection = orderGridComponent.selection;
However the selection is always "null". 但是,选择始终为“空”。 The grid is defined as:
网格定义为:
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
}]
});
and used as 并用作
{
xtype: 'ordergrid',
itemId: 'ordergrid',
}
I've also tried let selection = orderGridComponent.selected
or getSelected
and many many variants that seem to be suggested around the internet for other ext versions. 我还尝试了
let selection = orderGridComponent.selected
或getSelected
以及许多其他版本的互联网建议的变体。
So how to do this for the modern 6.5.2 framework? 那么对于现代的 6.5.2框架该如何做呢?
You need to use grid.getSelection()
method to get selected record. 您需要使用
grid.getSelection()
方法来获取选定的记录。
In this FIDDLE , I have created a demo using grid
. 在这个FIDDLE中 ,我使用
grid
创建了一个演示。 I hope it will help you to achieve your requirement. 希望它能帮助您达到要求。
Code Snippet 代码段
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>'
}
}]
})
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.