2013-03-01 127 views
3

我使用ExtJS的3,我需要启用/禁用特定文本字段,当我选择/取消选中复选框,就像下面的例子表明:的复选框选择启用/禁用文本字段ExtJS的

{ 
    fieldLabel: 'myCheckBox' 
    xtype: 'checkbox', 
    name: 'myCheckBox' 
},{ 
    fieldLabel: 'myTextField' 
    xtype: 'textfield', 
    name: 'myTextField', 
    disabled: true 
} 

据我所知,我在“myCheckBox”使用监听器是这样的:

listeners: { 
    change: function() { 

    } 
} 

但我不知道是什么参数传递给我的功能以及如何定位“myTextField”和.enable().disable()它。你能帮我么?非常感谢你。基于答案


解决方案(谢谢):

listeners: { 
    change: function(cb, checked) { 
     Ext.getCmp('myTextField').setDisabled(!checked); 
} 
} 

,并添加了ID标签的文本字段组件这样的:

id: 'myTextField' 
+0

谢谢Mark Peters和Ankit的正确答案。我已经在解决方案中使用了它们,我已经将其添加到其他人的初始问题中,并且具有相同的疑问 – mikethe 2013-03-01 17:58:23

回答

4

如果您不确定要传递什么参数而不是Ext.getCmp()为您提供组件。它将组件的id作为参数。在你的情况下,你必须将id分配给textfield,并且可以将它作为Ext.getCmp('myTextField')在change事件上获取。其中myTextField是文本字段的ID。组件的名称和Id可以相同。

listeners: { 
change: function() { 
    Ext.getCmp('myTextField').disable(); 
    //or 
    Ext.getCmp('myTextField').enable(); 
} 
} 
+0

谢谢Ankit – mikethe 2013-03-01 18:05:12

1

有参考myTextField几种方法。最简单的是可能给该领域的ref(请注意,这种方法并不能在ExtJS的4,你在哪里与组件查询更好的工作):

{ 
    fieldLabel: 'myTextField' 
    xtype: 'textfield', 
    name: 'myTextField', 
    ref: '../myTextField' 
    disabled: true 
} 

设置裁判将导致文本框组件是在其所有者或其祖先的财产中引用。所以,那么你的听众可以简单地是这样的(传递给这个函数的参数是listed in the doc):

change: function(cb, checked) { 
    me.myTextField.setDisabled(!checked); 
} 

你可能需要调整ref路径取决于您的组件层次。

+0

谢谢Mark Peters – mikethe 2013-03-01 18:05:36

1

实施例:

  1. 使用setDisabled API: theStudentForm.findField( 'stud_name')setDisabled(真)。

  2. 使用setOpacity API: theStudentForm.findField( 'stud_name')labelEl.setOpacity(1);

  3. 使用只读API: theStudentForm.findField( 'stud_name')setReadOnly(真)。

相关问题