Question

我有一个网格，其中的一列具有配置为文本字段的编辑器。

var grid = Ext.create('Ext.grid.Panel', {
            title: 'Simpsons',
            itemId: 'gridPanel123',
            store: store,
            plugins: {
                ptype: 'cellediting',
                clicksToEdit: 1
            },
            columns: [{
                text: 'Name',
                dataIndex: 'name',
                editor: {
                    xtype: 'textfield'
                }
            }]
});

说该列看起来像这样，

显然，该列的值为ABCDE。现在，当用户单击该列时，编辑器模式将弹出如下内容：

现在我的问题是，是否有任何一种渲染器会根据列的值更改编辑器的内容。

考虑我的示例，列值为“ ABCDE”，因此编辑器值也为“ ABCDE”。

但是如果我想用编辑器中的“ Z”替换列中的所有“ A”，那么对我来说编辑器值应该是“ ZBCDE”。在extjs中怎么可能？

Answer 1

您可以通过在单元格编辑插件的beforeEdit事件中设置值来做到这一点。

cellediting: {
     listeners: {
          beforeEdit: function (editor, context) {
               context.value = context.value.replace("A", "Z");
          }
     }
}

要确定应替换哪一列，只需添加检查：

if(context.column.dataIndex == 'name'){
    context.value = context.value.replace("A", "Z");
}

要反向替换，请尝试：

validateEdit: function (editor, context){
    context.record.set('name', context.value.replace("Z", "A"));
    context.record.commit();
}

小提琴示例：https://fiddle.sencha.com/#view/editor&fiddle/2thq。

如何在网格面板的列的编辑器中以不同方式呈现文本（ExtJs6.0.2）

1 个答案: