2017-09-22 37 views
0

我不是很熟悉Ext Js中的所有綁定和配置。所以我有一個帶有電子郵件(mailto)按鈕的文本字段。我想啓用或禁用按鈕只有。但我不知道如何開始處理觸發器本身。所以我嘗試在我的ViewController中進行綁定,如下所示:從文本字段中禁用/啓用觸發器

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

這是在sencha架構師中創建的視圖中的代碼。

{ 
    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' 
      } 
    } 
} 
+0

禁止狀態你能請讓我知道你的按鈕形式的內部? –

+0

窗體>標籤面板>容器>文本域 –

+0

我認爲你可以使用** [formBind](https://docs.sencha.com/extjs/6.5.1/classic/Ext.button.Button.html#cfg- formBind)**希望它能幫助你。 –

回答

1

只看到在觸發器上的綁定,這個內聯代碼可能會有所幫助。它將文本字段的hideTrigger配置綁定到View Model屬性。這Fiddle有工作代碼。

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配置綁定到一個文本框的一些其他配置,如。值。這個內聯代碼顯示了這種方法。您可以檢查它here.

Ext.create('Ext.form.field.Text', { 
       viewModel:{}, 
       flex: 2, 
       itemId: 'txtContactEmail', 
       margin: '0 5 0 0', 
       fieldLabel: 'Email', 
       labelWidth: 35, 
       validateOnChange: false, 
       validateOnBlur: false, 
       //Set a reference on textfield and publish its value 
       // Use this reference to do the binding 
       value: 'Some Value', 
       reference: 'mytextfield', 
       publishes: ['value'], 
       bind: { 
        hideTrigger: '{mytextfield.value}' 
       }, 
       triggers: { 
        trgEntityEmail: { 
         cls: 'x-form-email-trigger' 
        } 
       } 
      }); 
+0

「我想啓用或禁用按鈕」 - 要禁用按鈕本身,您應該綁定'disabled:{!x}'而不是'hideTrigger'屬性。 – NAmorim

1

Ext.field.trigger.Trigger不能啓用/禁用開箱。

我想你可以效仿這樣

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

感謝您的鏈接..但我做了什麼是禁用按鈕使用extraCls =「X-item-disabled」 –