ExtJS网格单元格编辑
问题描述:
我正在使用extjs 4格编辑插件与extjs网格。它在一个网格上工作正常,但是当我在同一页面上创建一个新的网格时,也需要单元格编辑,退出网格数据消失。我花了整整一天的时间来诊断问题,但徒劳无益。ExtJS网格单元格编辑
以下为模型,存储和网格代码:
Ext.define('site', {
extend: 'Ext.data.Model',
fields: [{
name: 'siteid'
}, {
name: 'description'
}, {
name: 'picevd'
}, {
name: 'Dateofaudit',
type: 'date',
dateFormat: 'Y-m-d'
}, {
name: 'dateofrecord',
type: 'date'
}, {
name: 'id'
}]
});
Ext.define('d696', {
extend: 'Ext.data.Model',
fields: [{
name: 'siteid'
}, {
name: 'description'
}, {
name: 'picevd'
}, {
name: 'Dateofaudit',
type: 'date',
dateFormat: 'Y-m-d'
}, {
name: 'dateofrecord',
type: 'date'
}, {
name: 'id'
}]
});
var Dstore = Ext.create('Ext.data.Store', {
//autoDestroy: true,
storeId: 'Dstore',
autoLoad: true,
model: 'site',
proxy: {
url: '../server/sitetheftgrid.php?TYPE=SITE',
type: 'ajax',
reader: {
type: 'json',
root: 'results'
}
},
sorters: [{
property: 'Dateofaudit',
direction: 'ASC'
}]
}); // END Dstore
Ext.create('Ext.data.Store', {
//autoDestroy: true,
storeId: 'a',
model: 'd696',
proxy: {
url: '../server/sitetheftgrid.php',
type: 'ajax',
reader: {
type: 'json',
root: 'results'
}
}
//sorters: [{property: 'Dateofaudit',direction:'ASC'}]
}); // END Dstore
var cellEditing = Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 2
});
var grid = Ext.create('Ext.grid.Panel', {
store: Dstore,
columns: [{
id: 'siteid',
header: 'Site Id',
dataIndex: 'siteid',
width: 100,
field: {
allowBlank: false
}
}, {
header: 'Detail',
dataIndex: 'description',
flex: 1,
field: {
allowBlank: false
}
}, {
header: 'Date Of Audit',
dataIndex: 'Dateofaudit',
width: 150,
field: {
xtype: 'datefield',
format: 'm/d/y'
}
}, {
header: 'Date Of Record',
dataIndex: 'dateofrecord',
width: 150
}],
width: '100%',
height: 300,
id: 'sitegrid',
frame: true,
plugins: [cellEditing]
});
var stor = Ext.data.StoreManager.lookup('a');
Ext.create('Ext.grid.Panel', {
store: stor,
columns: [{
header: 'Site Id',
dataIndex: 'siteid1',
width: 100,
field: {
allowBlank: false
}
}, {
header: 'Detail',
dataIndex: 'description2',
flex: 1,
field: {
allowBlank: false
}
}, {
header: 'Date Of Audit',
dataIndex: 'Dateofaudit4',
width: 150,
field: {
xtype: 'datefield',
format: 'm/d/y'
}
}, {
header: 'Date Of Record',
dataIndex: 'dateofrecord2',
width: 150
}],
width: '100%',
height: 300,
id: 'sitegrid2',
frame: true,
autoScroll: true, //when i uncomment this data in first grid vanishes
/* plugins:[ Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})]*/
});
答
只需使用每格
不同的单元格编辑例如:
var cellEditing1 = Ext.create('Ext.grid.plugin.CellEditing', {clicksToEdit: 2});
var cellEditing2 = Ext.create('Ext.grid.plugin.CellEditing', {clicksToEdit: 2});
答
尝试在组件初始化添加插件。这对我很有帮助
Ext.create('Ext.grid.Panel', {
store: stor,
columns: [{
header: 'Site Id',
dataIndex: 'siteid1',
width: 100,
field: {
allowBlank: false
}
}, {
header: 'Detail',
dataIndex: 'description2',
flex: 1,
field: {
allowBlank: false
}
}, {
header: 'Date Of Audit',
dataIndex: 'Dateofaudit4',
width: 150,
field: {
xtype: 'datefield',
format: 'm/d/y'
}
}, {
header: 'Date Of Record',
dataIndex: 'dateofrecord2',
width: 150
}],
width: '100%',
height: 300,
id: 'sitegrid2',
frame: true,
autoScroll: true,
initComponent: function() {
this.plugins = [Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})];
this.callParent(arguments);
}
});
尝试为其他网格面板制作另一个cellEditing。 – TheHorse 2011-05-20 09:23:55
您是否找到任何解决方案?我面临同样的问题。 – 2011-06-16 16:43:36
也面临同样的问题,呃 – Pyrite 2015-05-27 19:46:22