Question

我们正在使用旧版本的extJS（2.3.0）我在选择文件按钮时遇到了一些麻烦/这是我的代码

var uploadBtn = new Ext.Panel({
    tbar : [
        {text: 'Upload CSV file', id: 'upload-btnn', handler: uploadHandler} // tbbutton is the default xtype if not specified
    ]
});


var fileField = new Ext.ux.form.FileUploadField({
     fieldLabel: 'File name',
     id: 'form-file',
     emptyText: 'Select a Document',
     name: 'file', 
     hideButton: true                      
     //buttonText: 'Оберіть файл'       
});

var fileUploader = new Ext.FormPanel({
   id:'upload-form',
   fileUpload: true,
   header: false,
   hidden: true,
   labelWidth: 75,
   frame:true,
   bodyStyle:'padding:5px 5px 0',
   autoWidth: true,
   //defaultType: 'textfield',
   items: [          
      fileField
   ],
   buttons: [{
      text:'upload',
      handler: submitIt
   },{
      text: 'cancel',
      handler: function(){
         fileUploader.getForm().reset();
         fileUploader.hide();
         //$('upload-btnn').show();
         //uploadBtn.show();
      }
   }],
   border:false,
   scope: this
});



function submitIt(){
   fileUploader.getForm().isValid();
   fileUploader.getForm().submit({
      url: 'links_generation/file_upload',        
      clientValidation: false,
      waitMsg: 'Uploading your Document...',
      success: function(fp, o){
         //msg('Success', 'Processed file "'+o.result.file+'" on the server');

         fileUploader.getForm().reset();             
         //fileUploadWin.hide();
      },
      failure: function(a,b) {            
         fileUploader.getForm().reset();
         //fileUploadWin.hide();
      }
   });
}   

function uploadHandler(){
    this.hide();      
    fileUploader.show();
}

它出现两个按钮。我需要影响一个选择文件按钮（正确设置样式）或至少隐藏浏览按钮。将不胜感激任何建议

Answer 1

我没有看到您使用的是自定义＆＃39;文件字段＆＃39;，因此最好将其用作自我初始化的项目。

试试这个

items: [
     {          
      xtype:'filefield', //change the xtype as per doc
      fieldLabel: 'File name',
      id: 'form-file',
      emptyText: 'Select a Document',
      name: 'file', 
      hideButton: true  
     }
   ]

Answer 2

试试这个..

 items: [{
    xtype: 'filefield',
    name: 'photo',
    fieldLabel: 'Upload a file',
    emptyText: 'Click here to browse files...',
    labelWidth: 100,
    msgTarget: 'side',
    allowBlank: false,
    anchor: '100%',
    buttonText: '',
    buttonConfig: {
      cls: 'browseBtnCls'
    }
  }]

并在css中添加以下类

.browseBtnCls {padding: 0px !important;background-color: transparent !important; border-color: transparent; width: 0px}

检查this工作小提琴。

如何在extJs中隐藏选择文件按钮

2 个答案: