多选器的选择存储在哪个商店(extjs)?
In which store is the selection of a multiselector stored (extjs)?
该文档提供的有关多选器的信息非常有限,目前甚至没有显示示例代码。在我无法展示的工作项目中,多选器被赋予一个商店,从中向用户展示项目,然后在控制器中,他们使用相同的商店来获取所选项目。我不明白这是怎么回事。任何见解将不胜感激。
我在发布之前对这个问题的研究包括 sencha 文档、sencha 论坛和 Whosebug 论坛。同样,我发现有关如何从多选器检索项目的信息非常有限。
您可以通过两种方式从 MultiSelector
中获取所选数据
- 使用
multiSelector.getStore().getData().items
- 此商店仅包含从搜索弹出窗口中选择的数据。这家商店将填写搜索网格的选择更改。
- 使用
multiselector.searchPopup.down('grid').getSelection()
这两种方法都将 return 您从 multiselector
中选择的记录。
在此FIDDLE中,我使用multiselector
创建了一个演示。
代码片段
Ext.application({
name: 'Fiddle',
launch: function () {
Ext.create({
xtype: 'panel',
bodyPadding: 10,
title: 'MultiSelector',
renderTo: Ext.getBody(),
tbar: [{
text: 'Get Selected recrod',
handler: function () {
var multiselector = this.up('panel').down('multiselector'),
data = multiselector.getStore().getData().items;
alert(`Total record selected number is ` + data.length);
//Get selected record by searchPopup
if (multiselector.searchPopup) {
console.log('Get selected record by searchPopup', multiselector.searchPopup.down('grid').getSelection().length);
}
}
}],
items: [{
xtype: 'multiselector',
valueField: 'id',
displayField: 'name',
showDefaultSearch: true,
plusButtonType: 'add',
hideHeaders: true,
colspan: 2,
search: {
xtype: 'multiselector-search',
store: {
type: 'store',
fields: ['id', 'name'],
autoload: true,
data: [{
id: 1,
name: 'Option 1 -- I want to get this'
}, {
id: 2,
name: 'Option 2 -- I want to get this'
}, {
id: 3,
name: 'Option 3 -- I want to get this'
}, {
id: 4,
name: 'Option 4 -- I want to get this'
}, {
id: 5,
name: 'Option 5 -- I want to get this'
}, {
id: 6,
name: 'Option 6 -- I want to get this'
}, {
id: 7,
name: 'Option 7 -- I want to get this'
}]
}
}
}]
});
}
});
该文档提供的有关多选器的信息非常有限,目前甚至没有显示示例代码。在我无法展示的工作项目中,多选器被赋予一个商店,从中向用户展示项目,然后在控制器中,他们使用相同的商店来获取所选项目。我不明白这是怎么回事。任何见解将不胜感激。
我在发布之前对这个问题的研究包括 sencha 文档、sencha 论坛和 Whosebug 论坛。同样,我发现有关如何从多选器检索项目的信息非常有限。
您可以通过两种方式从 MultiSelector
- 使用
multiSelector.getStore().getData().items
- 此商店仅包含从搜索弹出窗口中选择的数据。这家商店将填写搜索网格的选择更改。 - 使用
multiselector.searchPopup.down('grid').getSelection()
这两种方法都将 return 您从 multiselector
中选择的记录。
在此FIDDLE中,我使用multiselector
创建了一个演示。
代码片段
Ext.application({
name: 'Fiddle',
launch: function () {
Ext.create({
xtype: 'panel',
bodyPadding: 10,
title: 'MultiSelector',
renderTo: Ext.getBody(),
tbar: [{
text: 'Get Selected recrod',
handler: function () {
var multiselector = this.up('panel').down('multiselector'),
data = multiselector.getStore().getData().items;
alert(`Total record selected number is ` + data.length);
//Get selected record by searchPopup
if (multiselector.searchPopup) {
console.log('Get selected record by searchPopup', multiselector.searchPopup.down('grid').getSelection().length);
}
}
}],
items: [{
xtype: 'multiselector',
valueField: 'id',
displayField: 'name',
showDefaultSearch: true,
plusButtonType: 'add',
hideHeaders: true,
colspan: 2,
search: {
xtype: 'multiselector-search',
store: {
type: 'store',
fields: ['id', 'name'],
autoload: true,
data: [{
id: 1,
name: 'Option 1 -- I want to get this'
}, {
id: 2,
name: 'Option 2 -- I want to get this'
}, {
id: 3,
name: 'Option 3 -- I want to get this'
}, {
id: 4,
name: 'Option 4 -- I want to get this'
}, {
id: 5,
name: 'Option 5 -- I want to get this'
}, {
id: 6,
name: 'Option 6 -- I want to get this'
}, {
id: 7,
name: 'Option 7 -- I want to get this'
}]
}
}
}]
});
}
});