ExtJS 4-如何有条件地编辑网格中的单元格？

Question

我有一个使用单元格编辑插件的网格面板。

在此网格面板中，我希望通过以下方式对单元格进行条件编辑:

当用户单击单元格进行编辑时，应该显示确认对话框-“您要编辑单元格吗？” -如果他选择"is"，则该单元格将聚焦并开始编辑，否则该单元格将保持禁用状态。

我已经尝试过使用'beforeedit'事件，但是即使显示确认框时，用户也可以使用箭头键(因为编辑器是一个数字字段)来修改值，也就是说，虽然禁用了鼠标单击，但是箭头键仍然可以更改字段的值。

另外，当用户选择"is"时，单元格失去焦点，单击"is"后，我无法使其立即开始编辑。我尝试使用“聚焦”方法，但是没有运气。

能对此提供一些指导吗？

提前致谢。

更多信息:

当用户选择"is"时，我尝试使用-startEditByPosition()-单元格编辑插件的功能。但是，由于这个原因，确认框会继续出现，就像选择"is"一样，编辑开始并再次调用beforeedit事件。有什么帮助吗？

Answer 1

您可以创建一些标记变量，例如isEditAllowed。在beforeedit中检查它。如果为假，则显示confirm，否则不执行任何操作。如果用户确认，则将isEditAllowed设置为true和startEditByPosition。在edit事件中，将isEditAllowed设置为false:

        plugins: [
          Ext.create('Ext.grid.plugin.CellEditing', {
              clicksToEdit: 1,
            listeners: {
              'beforeedit': function(e) {
                var me = this;
                var allowed = !!me.isEditAllowed;
                if (!me.isEditAllowed)
                  Ext.Msg.confirm('confirm', 'Are you sure you want edit?', function(btn){
                    if (btn !== 'yes')
                      return;
                    me.isEditAllowed = true;
                    me.startEditByPosition({row: e.rowIdx, column: e.colIdx});
                  });
                return allowed;
              },
              'edit': function(e) {
                this.isEditAllowed = false;
              }
            }
          })
      ],

Here is demo.