0
Я пытаюсь реализовать в ExtJs 3.4 GridPanel с редактируемыми столбцами. Я попытался адаптировать пример из ExtJs, но я не могу заставить его работать. (Пример: http://dev.sencha.com/deploy/ext-3.4.0/examples/grid/edit-grid.html)ExtJS 3.4 GridPanel с доступными столбцами
Отображаются сохраненные значения в базе данных, а также кнопка «Добавить». Но если я нажимаю в одной ячейке (например, «имя столбца»), ничего не происходит, но я бы ожидал, что ячейка «открыта», чтобы я мог ввести новое значение.
Любые предложения?
var fm = Ext.form;
var editGrid = new Ext.grid.GridPanel(
{
id : 'editTable',
title : 'Edit table SAP_SYSTEM',
header : true,
renderTo : 'contentDivSystem',
height:350,
style: 'margin-bottom: 50px',
columns : [
{
hidden : true,
header : 'id',
dataIndex : 'id',
editable : false
},
{
header : 'name',
dataIndex : 'name',
editable : true,
sortable : true,
flex : 10,
editor: new fm.TextField({
xtype : 'textfield',
allowBlank: false
})
//,
//field : {
//xtype : 'textfield',
//allowBlank : false,
//}
},
{
header : 'applicationserver',
dataIndex : 'as_host',
editable : true,
flex : 10,
sortable : true,
field : {
xtype : 'textfield',
allowBlank : false
}
},
{
header : 'systemnumber',
dataIndex : 'system_number',
editable : true,
flex : 10,
sortable : true,
field : {
xtype : 'textfield',
allowBlank : false
}
},
{
header : 'client',
dataIndex : 'client',
editable : true,
sortable : true,
flex : 10,
field : {
xtype : 'textfield',
allowBlank : false
}
},
{
header : 'language',
flex : 10,
dataIndex : 'language',
editable : true,
field : {
xtype : 'textfield',
allowBlank : false
}
},
{
header : 'saprouterstring',
dataIndex : 'sap_router_string',
editable : true,
flex : 10,
field : {
xtype : 'textfield',
allowBlank : false
}
},
{
header : 'poolcapacity',
dataIndex : 'pool_capacity',
editable : true,
flex : 10,
field : {
xtype : 'textfield',
allowBlank : false
}
},
{
header : 'pool size',
dataIndex : 'pool_size',
editable : true,
flex : 10,
field : {
xtype : 'textfield',
allowBlank : false
}
},
{
xtype : 'actioncolumn',
width : 20,
align : 'center',
items : [ {
icon : '../images/icons/silk/delete.png',
tooltip : 'Delete Row',
handler : function(grid, rowIndex,
colIndex) {
var rec = grid.store
.getAt(rowIndex);
if (rec.data.id !== null
&& rec.data.id !== '') {
deleteIds.push(rec.data.id);
}
grid.store.removeAt(rowIndex);
Ext.defer(layoutfunction, 10, customobject);
}
} ]
} ],
selType : 'cellmodel',
//plugins : [editor],
/* plugins : [ Ext.create(
'Ext.grid.plugin.CellEditing', {
clicksToEdit : 1
}) ], */
store : myStore,
stateful : false,
border : true,
enableColumnHide : false,
enableColumnMove : false,
//loadMask : true,
//stripeRows : true,
autoScroll : true,
tbar : [ {
xtype : 'button',
icon : '../images//icons/silk/add.png',
dock : 'bottom',
listeners : {
click : function() {
var grid = Ext.getCmp('editTable');
var myNewRecord = new MyRecord({
id : '',
as_host : '',
system_number : '',
client : '',
language : '',
sap_router_string : '',
pool_capacity : '',
pool_size : '',
sap_id : ''
});
grid.store.add(myNewRecord);
Ext.defer(layoutfunction, 10, customobject);
}
},
afterrender : function(cmp) {
Ext.defer(layoutfunction, 100, customobject);
}
}, {
xtype : 'button',
icon : '../images//icons/silk/disk.png',
listeners : {
click : function() {
var grid = Ext.getCmp('editTable');
save(grid.store.data.items);
}
}
} ],
dockedItems : [ {
xtype : 'pagingtoolbar',
store : myStore, // same store GridPanel is using
dock : 'bottom',
displayInfo : true
} ],
listeners : {
beforeChange : function(pagingToolbar, params) {
deleteIds = [];
updateIds = [];
pagingToolbar.store.baseParams = {
eventPath : 'FrontEndCRUDHandler',
eventMethod : 'getSapSystemData',
jsonInput : Ext.encode({
tableName : 'SAP_SYSTEM',
start : 0,
limit : rowLimit
})
}
},
afterlayout : function() {
Ext.defer(layoutfunction, 10, customobject);
},
afterrender : function(cmp) {
Ext.defer(layoutfunction, 100, customobject);
}
}
});
Пожалуйста, найдите время, чтобы сделать скрипку образец с вашей проблемой. – Michel
Возможно, вы хотели использовать Ext.grid.EditorGridPanel? –
@ Vasile Bors: Жизнь может быть такой легкой ;-) Thx много. Вы хотите опубликовать ответ, чем я могу пометить мой вопрос как решенный. – LStrike