Extjs 为模型动态赋值
我试了一下,但没有成功 我有两个网格和一个按钮。最初,第二个网格将保持为空,第一个网格将有一些记录。。当我在第一个网格中选择一些记录并单击按钮时,第二个网格应该只填充第一个网格中选定的行 这是我的密码:Extjs 为模型动态赋值,extjs,extjs4,extjs4.1,Extjs,Extjs4,Extjs4.1,我试了一下,但没有成功 我有两个网格和一个按钮。最初,第二个网格将保持为空,第一个网格将有一些记录。。当我在第一个网格中选择一些记录并单击按钮时,第二个网格应该只填充第一个网格中选定的行 这是我的密码: Ext.QuickTips.init(); var getLocalStore = function() { return Ext.create('Ext.data.ArrayStore', { model: 'Company', data: Ext.g
Ext.QuickTips.init();
var getLocalStore = function() {
return Ext.create('Ext.data.ArrayStore', {
model: 'Company',
data: Ext.grid.dummyData
});
};
var getSelectedStore = function() {
return Ext.create('Ext.data.ArrayStore', {
model: 'Company'
});
};
var sm = Ext.create('Ext.selection.CheckboxModel');
var grid1 = Ext.create('Ext.grid.Panel', {
id: 'grid1',
store: getSelectedStore(),
columns: [
{text: "Company", width: 200, dataIndex: 'company'},
{text: "Price", renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
{text: "Change", dataIndex: 'change'},
{text: "% Change", dataIndex: 'pctChange'},
{text: "Last Updated", width: 135, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
],
columnLines: true,
width: 600,
height: 300,
frame: true,
title: 'Framed with Checkbox Selection and Horizontal Scrolling',
iconCls: 'icon-grid',
renderTo: 'grid1'
});
var grid2 = Ext.create('Ext.grid.Panel', {
id: 'grid2',
store: getLocalStore(),
selModel: sm,
columns: [
{text: "Company", width: 200, dataIndex: 'company'},
{text: "Price", renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
{text: "Change", dataIndex: 'change'},
{text: "% Change", dataIndex: 'pctChange'},
{text: "Last Updated", width: 135, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
],
columnLines: true,
width: 600,
height: 300,
frame: true,
title: 'Framed with Checkbox Selection and Horizontal Scrolling',
iconCls: 'icon-grid',
renderTo: 'grid'
});
Ext.widget('button', {
text: 'Click Me',
renderTo: 'btn',
listeners: {
click: function(this1, evnt, eOpts ){
var records = sm.getSelection();
getSelectedStore().loadData(records,true);
grid1.getView().refresh();
/*Ext.each(records, function (record) {
alert(record.get('company'));
});*/
}
}
});
请告诉我出了什么问题。首先,您要定义调用时返回新存储实例的函数
getSelectedStore
和getLocalStore
。这样,在你的点击处理程序中,你每次都会抓到一个空的商店!丢失函数位,只需如下设置变量:
var storeToSelectFrom = Ext.create('Ext.data.ArrayStore', {
model: 'Company',
data: someDataToChooseFrom
});
var storeToPutTo = Ext.create('Ext.data.ArrayStore', {
model: 'Company'
});
然后,使用这些变量作为存储定义网格:
var grid1 = Ext.create('Ext.grid.Panel',{
store: storeToSelectFrom,
selType: 'checkboxmodel'
// rest of your configs
});
var grid2 = Ext.create('Ext.grid.Panel',{
store: storeToPutTo
// rest of your configs
});
然后,使用单击处理程序创建按钮:
Ext.widget('button', {
handler: function (button, event) {
var selected = grid1.getSelectionModel().getSelection();
grid2.getStore().add(selected);
}
// rest of your configs
});
首先,定义调用时返回新存储实例的函数
getSelectedStore
和getLocalStore
。这样,在你的点击处理程序中,你每次都会抓到一个空的商店!丢失函数位,只需如下设置变量:
var storeToSelectFrom = Ext.create('Ext.data.ArrayStore', {
model: 'Company',
data: someDataToChooseFrom
});
var storeToPutTo = Ext.create('Ext.data.ArrayStore', {
model: 'Company'
});
然后,使用这些变量作为存储定义网格:
var grid1 = Ext.create('Ext.grid.Panel',{
store: storeToSelectFrom,
selType: 'checkboxmodel'
// rest of your configs
});
var grid2 = Ext.create('Ext.grid.Panel',{
store: storeToPutTo
// rest of your configs
});
然后,使用单击处理程序创建按钮:
Ext.widget('button', {
handler: function (button, event) {
var selected = grid1.getSelectionModel().getSelection();
grid2.getStore().add(selected);
}
// rest of your configs
});
好的,行了。如果我删除该函数,那么我在按钮处理程序中编写的代码也可以正常工作。您能建议哪种方法更好吗?调用
loadData
将触发刷新事件,因此您可能不需要以这种方式手动刷新网格视图,否则,现在我有一个场景,由第一个网格的选定行填充的第二个网格将在存储模型中有一些额外的列,以及第一个网格存储模型的所有现有列。我不知道如何达到这个要求。请让我知道这一点。更新您的模型以包含额外的字段,然后只配置列以在第二个网格面板中显示这些字段。好的。如果我删除该函数,那么我在按钮处理程序中编写的代码也可以正常工作。您能建议哪种方法更好吗?调用loadData
将触发刷新事件,因此您可能不需要以这种方式手动刷新网格视图,否则,现在我有一个场景,由第一个网格的选定行填充的第二个网格将在存储模型中有一些额外的列,以及第一个网格存储模型的所有现有列。我不知道如何达到这个要求。请让我知道这一点。更新您的模型以包含额外的字段,然后仅配置列以在第二个网格面板中显示这些字段。