ExtJs表单验证

Question

我在ExtJs中有一个表单。如果field1不为空，则field2必须不为空。但是即使监听器正在触发，它也无法正常工作。

 {
    xtype: 'panel',
    title: 'title 1',
    items: [{
        xtype: 'fieldset',
        title: 'field A',
        items: [{
            xtype: 'textfield',
            fieldLabel: 'Line 1',
            id: 'field1',
            listeners: {
                change: function(f, new_val) {
                    if (new_val) {
                        //alert("change" + new_val);
                        f.field2.allowBlank = false;
                    } else {
                        f.field1.allowBlank = true;
                    }
                }
            }
            code for field2
        }]
    }]
}

- fastcodejava

Answer 1

部分回答：

你的代码无法运行的原因是allowBlank是一个配置值--它只有在组件创建时才会生效。我经常看到这种错误--当浏览API文档时，你需要记住所有这些配置选项只在对象创建时有效--它们不是可以设置为修改现有对象行为的公共属性。

话虽如此，我很惊讶API中没有setAllowBlank()方法。如果我能找到解决方法，我将继续查找并修改这个答案。

编辑：从我阅读TextField源代码来看，你的方法应该是有效的。所以问题是为什么它没有生效。

编辑2：你可能未能获得对TextFields的引用。 f.field1可能没有指向你所想象的内容。你可以通过在TextField配置中添加ref:'field1'来解决这个问题。然后你的FormPanel将有一个名为field1的属性，你可以使用它来引用。

- timdev

---

我同意allowBlank是一个配置值，应该按照这样的方式使用，但你仍然可以像属性一样使用它。我在以前的项目中就这么做了，并且成功地实现了OP所描述的所需功能。现在我只需要等到回家后才能想起如何做:P。不过别误会，那段代码肯定是个丑陋的补救措施。 - McStretch

@McStretch - 看起来你是对的。我刚才查看了代码，TextField的内部确实在验证时检查这个.allowBlank属性。文档应该将其列为公共属性，而不仅仅是配置选项。 - timdev

我认为开发人员打算让它只读，但有些情况下动态修改属性是有用的，比如OP的情况。所以我同意，除非有更清晰的方法来开发这个功能，否则它应该成为一个属性。 - McStretch

@McStretch - 是的，我看不出有任何明显的解决办法。有趣的是，在TextField.js的第452行周围非常简单（而且冗余）地使用它。 - timdev

Answer 2

您可以使用markInvalid函数。例如：

if (new_val) {
    if(f.field2.getValue() == ''){
        f.field2.markInvalid('Cannot be empty');
    }
} else {
    // clears invalid flags on the field.
    f.field1.clearInvalid();
}

并不是说这是使用的确切代码，但你可以从中看到如何标记无效消息并清除无效消息。此外还有创建自己验证器的能力，但我不确定是否完全符合你的需求。

- FallenRayne