ExtJS 4.2“;“文件字段”;选择“文件”按钮用户界面呈现怪异
我想要一个简单的Extjs文档上传面板。我用过这个。我期待着这样的事情 但当我实现相同的示例时,我的面板显示如下(保存图像是因为我尝试了一些东西) 问题在于选择文件按钮。我知道sencha示例使用了某种CSS,但我试图通过CSS将图像作为背景,但这也没有帮助(如果我在按钮配置中设置了“icon”属性,即使按钮大小保持不变) 这是我的密码ExtJS 4.2“;“文件字段”;选择“文件”按钮用户界面呈现怪异,extjs,extjs4,extjs4.2,sencha-cmd,filefield,Extjs,Extjs4,Extjs4.2,Sencha Cmd,Filefield,我想要一个简单的Extjs文档上传面板。我用过这个。我期待着这样的事情 但当我实现相同的示例时,我的面板显示如下(保存图像是因为我尝试了一些东西) 问题在于选择文件按钮。我知道sencha示例使用了某种CSS,但我试图通过CSS将图像作为背景,但这也没有帮助(如果我在按钮配置中设置了“icon”属性,即使按钮大小保持不变) 这是我的密码 { xtype: 'form', padding: '5 5 5 5', flex: 1, frame: false,
{
xtype: 'form',
padding: '5 5 5 5',
flex: 1,
frame: false,
border: false,
title: 'File Upload Form',
bodyPadding: '50 10 0',
defaults: {
anchor: '100%',
allowBlank: false,
msgTarget: 'side',
labelWidth: 50
},
items: [{
xtype: 'textfield',
fieldLabel: 'Name'
},{
xtype: 'filefield',
id: 'form-file',
emptyText: 'Select an image',
fieldLabel: 'Photo',
name: 'photo-path',
buttonText: '',
buttonConfig: {
iconCls: "background:url(http://simonwai.com/images/save_icon.gif) no-repeat !important; border:none;"
//icon: "http://simonwai.com/images/save_icon.gif",
}
}],
buttons: [{
//text: 'Save',
icon: "http://simonwai.com/images/save_icon.gif",
handler: function(){
/*var form = this.up('form').getForm();
if(form.isValid()){
form.submit({
url: 'file-upload.php',
waitMsg: 'Uploading your photo...',
success: function(fp, o) {
msg('Success', tpl.apply(o.result));
}
});
}*/
}
},{
text: 'Reset',
handler: function() {
//this.up('form').getForm().reset();
}
}]
}
请帮忙 正如您在中看到的,您的代码对于ExtJS 4.2是正确的
您应该使用Sencha提供的主题之一的样式,或者扩展其中一个主题。尽管这个问题有点老了
我来这里也有同样的问题。运行“sencha app build”后,文件控件被正确呈现。我猜在新的应用程序构建之前,构建过程需要添加一些在开发模式下不可用的样式,而新的应用程序构建在其
requires
中具有文件控制,这对man没有帮助。我使用森查灰色主题。我不明白为什么要为这个按钮应用样式。请给我一个你的意思的例子。看看小提琴,你的代码+森查灰色主题风格与你的截图不符。可能您有一些覆盖/自定义,因此您的文件字段不使用主题样式。我没有自定义主题。在.Sencha/app/Sencha.cfg中,我的主题设置为Sencha灰色主题。所以我没有应用任何自定义主题。Federico,当你说我在使用自定义主题时,我记得我曾经尝试过实现自定义主题,但之后我恢复了所有更改。我只是在将应用程序设置回经典主题后再次构建它,一切都像一个魔咒。谢谢你,伙计。