Extjs 从文本字段禁用/启用触发器

我不太熟悉ExtJS中的所有绑定和配置。因此，我有一个带有电子邮件（mailto）按钮的文本字段。我只想启用或禁用按钮。但我不知道如何开始处理触发器本身。因此，我尝试在我的ViewController中进行绑定，如下所示：

txtContactEmail:{
   disabled: {someFunctionInViewModel}
}//this disables/enables the whole control 
 //I only want the trigger button to be disabled/enabled

这是在sencha architect中创建的视图中的代码

{
     xtype: 'textfield',
     flex: 2,
     itemId: 'txtContactEmail',
     margin: '0 5 0 0',
     fieldLabel: 'Email',
     labelWidth: 35,
     validateOnChange: false,
     validateOnBlur: false,
     triggers: {
           trgEntityEmail: {
                cls: 'x-form-email-trigger'
           }
     }
}

---

仅为了查看触发器上的绑定，此内联代码可能会有所帮助。它将文本字段的

hideTrigger

config绑定到视图模型属性。这是工作代码

 Ext.create('Ext.form.field.Text', {
        viewModel: {
            data: {
               x: false
            }
        },
        flex: 2,
        itemId: 'txtContactEmail',
        margin: '0 5 0 0',
        fieldLabel: 'Email',
        labelWidth: 35,
        validateOnChange: false,
        validateOnBlur: false,
        //Bind to x property of View Model
        bind: {
           hideTrigger: '{!x}'
        },
        triggers: {
              trgEntityEmail: {
                   cls: 'x-form-email-trigger' 
                }
        }
    });

另一种方法是将

hideTrigger

config绑定到文本字段的其他配置，例如值。这段内联代码展示了这种方法。你可以查一下

---

仅为了查看触发器上的绑定，此内联代码可能会有所帮助。它将文本字段的

hideTrigger

config绑定到视图模型属性。这是工作代码

 Ext.create('Ext.form.field.Text', {
        viewModel: {
            data: {
               x: false
            }
        },
        flex: 2,
        itemId: 'txtContactEmail',
        margin: '0 5 0 0',
        fieldLabel: 'Email',
        labelWidth: 35,
        validateOnChange: false,
        validateOnBlur: false,
        //Bind to x property of View Model
        bind: {
           hideTrigger: '{!x}'
        },
        triggers: {
              trgEntityEmail: {
                   cls: 'x-form-email-trigger' 
                }
        }
    });

另一种方法是将

hideTrigger

config绑定到文本字段的其他配置，例如值。这段内联代码展示了这种方法。你可以查一下

不能在开箱即用的情况下启用/禁用

我认为您可以像这样模拟禁用状态

var myTrigger = myTextField.getTriggers()['trgEntityEmail'];
// Apply disabled style with .setCls() or .setIconCls()
myTrigger.setIconCls('my-disabled-icon');
// Remove handler
myTrigger.sethandler(Ext.emptyFn);

不能在开箱即用的情况下启用/禁用

我认为您可以像这样模拟禁用状态

var myTrigger = myTextField.getTriggers()['trgEntityEmail'];
// Apply disabled style with .setCls() or .setIconCls()
myTrigger.setIconCls('my-disabled-icon');
// Remove handler
myTrigger.sethandler(Ext.emptyFn);

---

你能告诉我你的按钮在表单里面吗？表单>选项卡面板>容器>文本字段我想你可以使用希望它能帮助你。实际上没有单独的按钮。。这个按钮就是trgEntityEmail本身。你能告诉我你的按钮在表单里面吗？表单>选项卡面板>容器>文本字段我想你可以使用希望它能帮助你。实际上没有单独的按钮。。按钮只是trgEntityEmail本身。“我只想启用或禁用按钮”-要禁用按钮本身，您应该绑定

disabled:{！x}

，而不是

hideTrigger

属性。“我只想启用或禁用按钮”-要禁用按钮本身，您应该绑定

disabled:{！x}

而不是

hideTrigger

属性。感谢您的链接。。但我所做的是使用extraCls=“x-item-disabled”禁用按钮，感谢您的链接。。但我所做的是使用extraCls=“x-item-disabled”禁用按钮