1

ここで例を見て、その例から提供された JavaScript を使用しています。基本的に私が欲しいのは、必要な数のファイルを選択できるスタンドアロンのファイル チューザーです。私が試した例には、スタンドアロンのアップロード ボタンがありますが、複数のファイルを同時に強調表示することはできません。

このコードはボタンを作成しますが、同時に複数のファイルを読み込むことはできません:

var addFilesButton = new Ext.ux.form.FileUploadField({
    buttonText: 'Add Files...',
    buttonOnly: true,
    listeners: {
        'fileselected': function(fb, v){
          var Record = myGrid.getStore().recordType;
          var newFile = new Record({
            fileName:       v,
            type:           'src',
            version:        '5.9',
          });

          myGrid.stopEditing();
          myGrid.getStore().add(newFile);
          myGrid.startEditing(0, 0);
        }
    }
});
4

2 に答える 2

3

Ext.ux.form.FileUploadHTML INPUTフィールドを使用してアップロードするファイルを設定しますが、これはごく普通のことです。

HTML4 を使用している場合、最大 1 つのファイルを入力ファイル フィールドに割り当てることができます。

ただし、HTML5からは、複数のファイルを受け入れるように設定できる特別な属性があります。

それに応じてスクリプトを修正し、デモを作成しました。

HTML5 仕様はまだドラフト段階であることに注意してください。機能の互換性表は、caniuse.comで入手できます。

于 2013-07-25T00:43:35.650 に答える
1

私の MultiFileUploadField クラス:

MultiFileUploadField = Ext.extend(Ext.ux.form.FileUploadField, {
  multiple: false,

  createFileInput: function() {
    this.fileInput = this.wrap.createChild({
      id: this.getFileInputId(),
      name: this.name||this.getId(),
      cls: 'x-form-file',
      tag: 'input',
      type: 'file',
      size: 1
    }); 

    if(this.multiple){
      this.fileInput.dom.setAttribute('multiple', 'multiple');
    }   
  },  

 bindListeners: function(){
   this.fileInput.on({
     scope: this,
     mouseenter: function(){
       this.button.addClass(['x-btn-over','x-btn-focus'])
     },  
     mouseleave: function(){
       this.button.removeClass(['x-btn-over','x-btn-focus','x-btn-click'])
     },  
     mousedown: function(){
       this.button.addClass('x-btn-click')
     },  
     mouseup: function(){
       this.button.removeClass(['x-btn-over','x-btn-focus','x-btn-click'])
     },  
     change: function(){
       var v = this.fileInput.dom.files;
       this.setValue(v);
       this.fireEvent('fileselected', this, v); 
     }   
   }); 
  },  
});
于 2013-07-26T14:35:54.137 に答える