Ext Js如何将组合框添加到网格中的特定单元格?
问题描述:
我正在使用Ext Js v6.2,在我用ext js grid构建的应用程序表中,我想添加组合框到特定单元格[DEMO IMAGE ATTACHED],当我尝试将组合框的整个单元格更改添加到组合框时,但我需要特定的单元格来组合框。在这里,我的代码,我在文档和其他东西中搜索它并没有帮助,请解决问题。Ext Js如何将组合框添加到网格中的特定单元格?
Ext.define('OtherCharges1', {
extend: 'Ext.data.Model',
fields: [
{name: 'name', mapping: 'name'},
{name: 'age', mapping: 'age'},
{name: 'marks', mapping: 'marks'},
{name: 'rate', mapping: 'rate'}
]
});
var newData1 = [
{name: "Freight"},
{name: "Insurance" },
{name: " Addl Chrg(High Sea)"},
{name: "Revenue Deposit on"}
]
var gridStore3 = Ext.create('Ext.data.Store', {
model: 'OtherCharges1',
data: newData1
});
var otherStore1 = Ext.create('Ext.grid.Panel', {
cls: 'custom-grid',
id: 'OtherId',
store: gridStore3,
stripeRows: true,
width: '100%',
collapsible: false,
enableColumnMove: false,
columnLines: true,
sortableColumns: false,
enableColumnHide: false,
enableColumnResize: false,
enableRowHeightSync: true,
columns:
[
{
header: "",
dataIndex: 'name',
flex: 1
},
{
editor: {
xtype: 'textfield',
selectOnFocus: true
},
dataIndex: '',
flex: .5,
sortable: true,
hideable: false,
},
{
editor: {
xtype: 'textfield',
selectOnFocus: true
},
dataIndex: 'age',
flex: .5,
sortable: true,
hideable: false,
},
{
editor: {
xtype: 'textfield',
selectOnFocus: true
},
dataIndex: 'marks',
flex: .5,
sortable: true,
hideable: false,
},
{
editor: {
xtype: 'textfield',
selectOnFocus: true
},
dataIndex: 'rate',
flex: .5,
sortable: true,
hideable: false,
}],
selType: 'cellmodel',
plugins: [
Ext.create('Ext.grid.plugin.CellEditing', {
clicksToEdit: 1
})]
});
答
启用编辑的网格,你需要编辑beforeedit
事件的特定细胞。创建验证以确保您正在编辑所需的单元格。
在这种情况下,你只能在第1列和行编辑单元格1.
grid.on('beforeedit', function(editor, e) {
if (e.colIdx === 1 && e.rowIdx === 1)
{
return true;
}
else
{
return false;
}
});
记住,ExtJS的电网为0
See this example fidlle.
开始为了澄清,你想成为麦酒只编辑特定列中的某些单元格? –
@EvanTrimboli已经可以编辑所有的单元格,我关心的是特定单元格具有组合框的变化。 –
对,只有列中的一些单元格,不是所有的单元格? –