Question

我在ExtJS 4中有一个复杂的表单，根据用户从某些表单字段中选择的内容，动态启用或禁用表单的各个部分。 每当我停用表单字段时，我也会清除它当前的任何值。

我有一个表示表单的模型类。要加载表单，我使用form.loadRecord(model)。要在用户“提交”表单时更新我的模型，请使用model.set(form.getValues())。

问题是ext的getValues()实现会跳过禁用的表单字段。这会导致我的问题，因为一些已更改值的表单字段被禁用（即表单字段，其值在我禁用它时清除）。因此，当我调用model.set(...)时，模型中不会更新（清除）这些字段。

解决此问题的最佳方法是什么？我考虑过以下想法，但似乎都没有。如果你有一个更好的，我想听听它。

在调用model.setValues()之前清除模型（将所有字段设置为undefined）。不幸的是，没有model.clear()方法，所以这很快变得丑陋 - 我必须获取所有字段并迭代它们，逐个清除每个字段。
当我禁用并清除表单字段时，也清除模型字段。这似乎违反了关注点的分离，也意味着模型会发生变化，即使用户选择取消也不提交表单。
覆盖ext的form.getValues()实现，不跳过已禁用的字段。这更难看，因为需要更改的实际代码位于Ext.form.field.Field类，而不是Ext.form.Basic。

Answer 1

禁用字段通常（不仅仅是extj）始终从发布数据中排除。而是只读取字段。 readonly和disabled字段之间的平均差异就是。

Answer 2

这是您在第三点中公开的解决方案：您必须更改此行为的唯一方法是覆盖此方法。

Ext.override('Ext.form.field.Field', {
    getSubmitData: function() {
        var me = this,
            data = null;
        if (!me.isFileUpload()) {
            data = {};
            data[me.getName()] = '' + me.getValue();
        }
        return data;
    }
});

关于你的第一点，不是.reject（false）有用吗？

最新选项可以覆盖表单中每个字段的getSubmitData，如下所示：

{
   xtype: 'textfield',
   getSubmitData: this.getSubmitDataMyOwnVersion
}

Answer 3

我意识到这是一个老帖子，但我遇到了同样的问题。恕我直言，这是一个相当严重的问题，因为它可能会在您不知情的情况下导致数据问题。在我的情况下，我还在禁用时为false设置了几个复选框，但由于其工作方式，它们在幕后留下true。

作为一种解决方法，我现在遍历表单中的所有字段并手动更新每个字段的记录。它的工作量更多，但我不必覆盖任何类，并且循环足够通用，以便在表单定义发生更改时继续工作。

    var fields = this.getForm().getForm().getFields();
    var record = this.getForm().getRecord();

    for (var i = 0; i < fields.length; i++) {
        var name = fields.items[i].name;
        var value = fields.items[i].value;
        record.set(name, value);
    }

Answer 4

请注意，Mark Waggoner的回答打破了其他组件的任何高级组件/功能，因为它直接获取值而不是获取getSubmitValue（）。我不得不稍微修改一下Iontivero的回答，因为这不是我发现Extjs至少在4.2.0中调用的类。

Ext.define('YourAppName.override.Field', {
  override: 'Ext.form.field.Base',

  getSubmitData: function() {
      var me = this,
          data = null,
          val;
      if (me.submitValue && !me.isFileUpload()) {
          val = me.getSubmitValue();
          if (val !== null) {
              data = {};
              data[me.getName()] = val;
          }
      }
      return data;
  }
});

然后在Ext.application中：要求：[＆＃39; YourAppName.override.Field＆＃39;]，

Answer 5

到目前为止我还没有遇到过这个问题，但我使用update（）方法而不是setValue（）来更新我的模型。也许它以不同方式处理禁用字段或者也许我正在走上一条需要这个答案的道路，因为我们刚刚开始进行重大测试？ - 这是Form.update方法的基本用法，假设form是Ext.form.Panel而this.record是模型实例：

//Save record
form.updateRecord(this.record);
this.record.save();
this.record.commit();

如果这对您不起作用，我建议编写一个类似命名的方法并扩展表单面板以包含它，然后获取值数组然后通过每个值并仅在它不为空时更新它。

更新已禁用字段的表单记录

5 个答案: