ExtJs(4.2.0)带有xtype:按钮列的可编辑网格

ExtJs(4.2.0) Editable Grid with xtype : button column

本文关键字:按钮 网格 编辑 xtype 带有 ExtJs      更新时间:2023-09-26

下面是一段可执行代码,在网格编辑器中有一个按钮。我需要按钮出现在编辑器中,但我不需要从按钮更新的任何值。编辑器的更新功能似乎不再工作了。你知道我错过了什么吗?

Ext.create('Ext.data.Store', {
    storeId:'EmployeeData',
    fields:['name', 'email', 'phone'],
    data: [
        {"name":"aaa", "email":"aaa@emp.com", "phone":"987654321"},
        {"name":"bbb", "email":"bbb@emp.com", "phone":"987654321"},
        {"name":"ccc", "email":"ccc@emp.com", "phone":"987654321"},
        {"name":"ddd", "email":"ddd@emp.com", "phone":"987654321"}
    ]});
var grid = Ext.create('Ext.grid.Panel', {
    title: 'Employee',
    store: Ext.data.StoreManager.lookup('EmployeeData'),
    columns: [
        {header: 'Name',  dataIndex: 'name', editor: 'textfield'},
        {header: 'Email', dataIndex: 'email', flex:1,
            editor: {
                xtype: 'textfield',
                allowBlank: false
            }
        },
        {header: 'Phone', dataIndex: 'phone'},
        {header: 'button', dataIndex:'',editor:{xtype:'button',editable: false}}
    ],
    selType: 'rowmodel',
    plugins: [
        Ext.create('Ext.grid.plugin.RowEditing', {
            clicksToEdit: 1,
            pluginId: 'rowEditing'
        })
    ],
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

编辑器在每个x-field上使用getValue()函数,按钮控件没有getValue()函数,因此它抛出异常并未能更新记录。

也许你可以使用ActionColumn,如果它可以满足你的目的。

有点晚了,但我刚刚遇到了同样的问题。

您可以添加getValue方法来允许更新操作正确运行。

editor: {
    xtype: 'button',
    getValue: function() {
        return true;
    }
}