Extjs 禁用非窗体面板上的按钮

我有一个面板，它不是一个表单，但它像表单一样使用。当文本字段无效时，我需要禁用“addButton”按钮。文本字段的验证器函数中的禁用功能可以工作，但从视觉上看，按钮看起来仍然处于启用状态。 如何通过文本字段上的validator方法告诉按钮被视觉禁用

代码如下：

      items: [
    {
      xtype: 'textfield',
      validator: function(value) {
        var reg = /^\d+(,\d+)*$/;
        var addButton =  this.ownerCt.down('[itemId=addButton]');
        if (reg.test(value)===false) {
          addButton.disabled=true;
          addButton.allowDepress=false;
          return "Enter whole numbers separated by comma";

        }
        addButton.disabled=false;
        addButton.allowDepress=false;
        return true;

      },

这是工作样品

这是工作样品

---

要禁用FormPanel的submit按钮，可以将FormPanel的monitorValid设置为true，并将submit按钮的formBind设置为true

项目：[{
xtype:'ux.form'，
monitorValid:true，//必须添加
布局：{
类型：“hbox”，
对齐：“开始”，
包装：“拉伸”
},
项目：[{
名称：“测试”，
xtype:'textfield'，
fieldLabel:“测试”，
allowBlank:false，//这是将检查验证的属性
},
{
xtype:'ux.button'，
文本：“提交”，
宽度：120，
formBind：对
}]
}]

要禁用FormPanel的“提交”按钮，可以将FormPanel的监视器Valid设置为true，将“提交”按钮的formBind设置为true

项目：[{
xtype:'ux.form'，
monitorValid:true，//必须添加
布局：{
类型：“hbox”，
对齐：“开始”，
包装：“拉伸”
},
项目：[{
名称：“测试”，
xtype:'textfield'，
fieldLabel:“测试”，
allowBlank:false，//这是将检查验证的属性
},
{
xtype:'ux.button'，
文本：“提交”，
宽度：120，
formBind：对
}]
}]

是的，我需要调用setDisabled函数，而不是直接调用属性。现在它就像一个符咒-谢谢你！是的，我需要调用setDisabled函数，而不是直接调用属性。现在它就像一个符咒-谢谢你！

var button = Ext.create('Ext.button.Button',{
    renderTo: Ext.getBody(),
    text: 'Ok',
    disabled: true
});

Ext.create('Ext.form.field.Text',{
    allowBlank: false,
    renderTo: Ext.getBody(),
    listeners:{
        afterrender: function(){
            this.validate();
        },
        validitychange: function(me, isValid){
            button.setDisabled(!isValid);
        }
    }
});