ExtJS filefield设置disabled为true后按钮不灰显的解决办法

最新推荐文章于 2024-05-27 14:46:49 发布

笔心

最新推荐文章于 2024-05-27 14:46:49 发布

阅读量1.9w

点赞数 3

分类专栏： ExtJS 文章标签： ExtJS filefield fileupload disabled

本文链接：https://blog.csdn.net/qinshenxue/article/details/38299927

版权

ExtJS 专栏收录该内容

8 篇文章 1 订阅

订阅专栏

ExtJS4.1中，filefield设置默认值为true时，按钮是灰显的，但是如果调用setDisabled来设定的时候，发现浏览按钮不会灰显，但是的确是被禁用了。如何解决了，只能从源码入手了。原来源码中并没有主动对浏览按钮加上灰显的样式，只是当默认值为true时才会加。因此我们需要在源码中手动加上css样式。

默认源码如下：

disableItems: function(){
        var file = this.fileInputEl;
        if (file) {
            file.dom.disabled = true;
        }
        this['buttonEl-btnEl'].dom.disabled = true;
    },

    onEnable: function(){
        var me = this;
        me.callParent();
        me.fileInputEl.dom.disabled = false;
        this['buttonEl-btnEl'].dom.disabled = true;
    },

修改方法及修改后的源码如下：

Ext.override(Ext.form.field.File,{
	disableItems: function(){
        var file = this.fileInputEl;
        if (file) {
            file.dom.disabled = true;
        }
        this['buttonEl'].addCls('x-btn-disabled');
        this['buttonEl-btnEl'].dom.disabled = true;
    },

    onEnable: function(){
        var me = this;
        me.callParent();
        me.fileInputEl.dom.disabled = false;
        this['buttonEl'].removeCls('x-btn-disabled');
        this['buttonEl-btnEl'].dom.disabled = true;
    }	
});

经过修改后，测试截图如下。

正常