如何在 ExtJS5 中网格编辑器组合的当前记录中添加项目
How to add a item in current record of grid editor combo in ExtJS5
ExtJS 5
我有一个网格,它有 3 列(ID、学生、所选学生)。在第 2 列(学生)中,我绑定了静态数据。当我单击第二列的任何项目时,此记录应添加到当前记录或行的第3列(所选学生)中。我有一个按钮也称为(添加新项目),用于动态创建新行。
备注 - 当我通过单击添加新项目按钮添加新行时,将添加新行,并且 3 列(选定的学生)值应为空。
我尝试了很多,但没有得到解决方案。主要问题是,当我在第三列中绑定数据时,它会正确绑定,但是当我添加新行时,它也显示在新记录中,但不应该。如果我清除存储或组合项目,则它会从所有行而不是当前记录/行中删除。
Ext.onReady(function () {
var comboStore1 = Ext.create('Ext.data.Store',
{
fields: ['text', 'id'],
data:
[
{ "text": "Value1", "id" :1 },
{ "text": "Value2", "id": 2 },
{ "text": "Value3", "id": 3 }
]
});
var comboStore2 = Ext.create('Ext.data.Store',
{
fields: ['text', 'id']
});
var gridStore = Ext.create('Ext.data.Store',
{
fields: ['id', 'students', 'selectedStudents'],
data:
[
{ "id" : 1},
]
});
var window = new Ext.Window({
id: 'grdWindow',
width: 400,
height: 200,
items: [
{
xtype: 'panel',
layout: 'fit',
renderTo: Ext.getBody(),
items: [
{
xtype: 'button',
text: 'Add New Item',
handler: function () {
var store = Ext.getCmp('grdSample').store;
var rec = {
id: 1,
students: '',
selectedStudents: ''
}
store.insert(store.length + 1, rec);
}
},
{
xtype: 'grid',
id: 'grdSample',
store: gridStore,
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})
],
columns: [
{
header: 'id',
dataIndex: 'id'
},
{
header: 'Students',
dataIndex: 'students',
editor: {
xtype: 'combobox',
store: comboStore1,
displayField: 'text',
valueField: 'text',
queryMode: 'local',
listeners: {
select: function (combo, records) {
var rec = records[0].data;
}
}
}
},
{
header: 'Selected Students',
dataIndex: 'selectedStudents',
editor: {
xtype: 'combobox',
id: 'combo2',
store: comboStore2,
displayField: 'text',
valueField: 'id'
}
}
]
}
]
}]
}).show();
});
我已经尝试了几乎所有方法,但仍然没有得到任何解决方案。换句话说 - 如何在网格编辑器组合中仅在当前行中插入值。(不应反映另一行)。如果正在反射另一行,那么如何在从另一行呈现之前删除值而不反射其他行。
好吧,我想主要问题是您尝试更改某些网格行编辑器组件,而它假设所有网格行都相同。
主要问题是,当我在第三列中绑定数据时,它会正确绑定,但是当我添加新行时,它也显示在新记录中,但不应该。如果我清除存储或组合项目,则它会从所有行而不是当前记录/行中删除。
发生这种情况是因为所有网格行编辑器都使用相同的存储实例 comboStore2
,并且当您更改其数据时,您会为所有编辑器更改它。
要为每个编辑器创建单独的存储,您必须执行以下操作:
{
header: 'Selected Students',
dataIndex: 'selectedStudents',
editor: {
xtype: 'combobox',
id: 'combo2',
store: Ext.create('Ext.data.Store', {
fields: ['text', 'id']
}),
displayField: 'text',
valueField: 'id'
}
}
但是,选择特定的行编辑器组件及其存储变得并非微不足道。
我建议您查看Ext.grid.column.Widget,因为您可以使用其onWidgetAttach 属性将某些行(实际上是其记录)绑定到widget。
你的第二列是虚拟的。您可以直接使用标记字段组件作为第三列的编辑器,这允许您选择多个值。
而且,您需要一个商店来存储所有学生的列表。
- 正在将数据主题添加到所有项目
- 使用Dnamics CRM 2011中的JavaScript读取子网格的所有记录,而不考虑活动页面
- 动态地改变“”的URL;添加新项目”;链接使用javascript/jquery
- 如何检查管道中未定义的项目
- 有没有一种方法可以添加相同的项目val=“0”;4〃;到JavaScript中数组的每个对象
- 学生搜索项目jquery/javascript
- 如何获取不属于我项目的上一页的URL
- Dojo:访问dijit.form.Select中单击的项目
- 角度的项目列表 ng 重复,ng 单击显示全宽描述
- AngularJs对所有页面中的所有记录进行排序
- 我需要为我的朋友在这个项目上提供帮助
- Netsuite Suitelet:在不达到治理限制的情况下,遍历事务行项目的列表加载和提交记录
- AngularJs/GitHub :如何在没有任何历史记录的情况下将角度种子克隆到我的新项目中
- 如何在 ExtJS5 中网格编辑器组合的当前记录中添加项目
- 项目/记录重新订购
- 如何在nesuite中删除销售订单中的现有记录行项目
- 组织和记录多文件JavaScript项目
- 如何记录/使用硒处理组合框和选择dijit使用的项目
- 套件脚本 从多选字段加载项目记录
- 向组合框中添加项目/记录