EXTJS 6.0.2 - 禁用文件字段按钮不起作用

Question

我试图从viewcontroller禁用在filefield的运行时禁用按钮，但我得到的错误。

错误Component.js

me.ariaEl.dom.setAttribute（ '咏叹调禁用'，假）; //无法读取空的特性 '的setAttribute'[似乎me.ariaEl.domis来为空]

错误堆栈跟踪.........

Uncaught TypeError: Cannot read property 'setAttribute' of null 
at constructor.onEnable (Component.js?version=20170809094755:4378) 
at constructor.callParent (Base.js?version=20170809094755:1288) 
at constructor.onEnable (Button.js?version=20170809094755:1786) 
at constructor.callParent (Base.js?version=20170809094755:1288) 
at constructor.onEnable (FileButton.js?version=20170809094755:165) 
at constructor.enable (Component.js?version=20170809094755:3033) 
at constructor.setDisabled (Component.js?version=20170809094755:4863) 

我有一个简单文件中的字段，

  { 
       xtype: 'filefield', 
       fieldLabel: 'Attach Items', 
       buttonText: 'Browse Items', 
       itemId : 'buttonid', 
       buttonConfig: { 
        id : 'uploadmailwidget0Btn' 


       }, 
      } 

试图在视图控制器为禁用 - 代码：

Ext.getCmp('uploadmailwidget0Btn').setDisabled(true); 

有人可以帮忙吗？问很简单，我想从viewcontroller禁用filefield上的按钮。

Answer 1

我认为你想要做的是在你的ViewController中使用lookup。

您需要添加一个引用到按钮

{ 
    xtype: 'filefield', 
    fieldLabel: 'Attach Items', 
    buttonText: 'Browse Items', 
    itemId : 'buttonid', 
    buttonConfig: { 
    id : 'uploadmailwidget0Btn', 
    }, 
    reference: 'myButtonRef' 
}, 

，并使用该引用的视图控制器使用lookup并更改禁用值。

function() { 
    this.lookup('myButtonRef').setDisabled(true); 
    } 

当然，我没有使用ExtJS的不多，但在理论上这应该工作

Answer 2

正如ExtJS 6 documentation所示，setDisabled方法是私有的，所以它是不可访问。

但是，我们可以做这样的事情。请记住，这个解决方案并不聪明，但它的工作原理。 测试example fiddle。

Ext.application({ 
    name : 'Fiddle', 
    launch : function() { 
     Ext.create('Ext.window.Window', { 
      title: 'Hello', 
      height: 200, 
      width: 400, 
      layout: 'fit', 
      items: [{ 
       xtype: 'filefield', 
       id: 'fileid', 
       fieldLabel: 'Attach Items', 
       buttonText: 'Browse Items', 
       itemId: 'buttonid', 
       buttonConfig: { 
        id: 'uploadmailwidget0Btn' 
       } 
      }, { 
       xtype: 'button', 
       text: 'Click to set disable', 
       handler : myBtnHandler 
      }] 
     }).show(); 

    } 
}); 

var myBtnHandler = function(btn) { 

    if (Ext.getCmp('fileid').bodyElement.dom.childNodes[0].childNodes[2].childNodes[1].childNodes[0].childNodes[2].disabled) 
    { 
     btn.setText('Click to set disable'); 
     Ext.getCmp('fileid').bodyElement.dom.childNodes[0].childNodes[2].childNodes[1].childNodes[0].childNodes[2].disabled = false; 
    } 
    else 
    { 
     btn.setText('Click to set enable'); 
     Ext.getCmp('fileid').bodyElement.dom.childNodes[0].childNodes[2].childNodes[1].childNodes[0].childNodes[2].disabled = true; 
    } 
}