是否可以使用extjs 5在文件上传窗口中选择多个文件?

时间:2014-06-18 18:44:13

标签: javascript html5 extjs

是否可以使用extjs 5?

在文件上传窗口中选择多个文件

3 个答案:

答案 0 :(得分:2)

只需添加如下属性multiple:''

var fileUploadButton = new Ext.create('Ext.form.field.File', {
        buttonOnly: true,
        hideLabel: true,
        buttonText: 'Upload Files...',
        fileInputAttributes: {
            accept: 'application/xml',
            multiple: ''
        });

答案 1 :(得分:1)

如果要显示文件的名称,可以这样做:

Ext.define('Ext.form.field.MyFile', {
    extend: 'Ext.form.field.File',
    alias: 'widget.multiplefileuploadfield',

    multiple: true,

    afterRender: function(){
        var me = this;

        me.callParent(arguments);

        if(me.multiple){
            me.fileInputEl.set({
                multiple:'multiple',
                name: me.name ? me.name + '[]' : 'files[]'
            });
        }
    }
});

Ext.define('Ext.form.field.FileButtonOverride', {
    override: 'Ext.form.field.FileButton',

    fireChange: function(e){
        var inp = this.fileInputEl.dom;

        if(!inp.files || !window.FileReader || !inp.files.length){
            this.fireEvent('change', this, e, inp.value);
            return;
        }

        var arrValues = [];
        for (var i = 0; i < inp.files.length; ++i) {
            arrValues.push(inp.files.item(i).name);
        }

        this.fireEvent('change', this, e, arrValues.join(', '));
    }
});

答案 2 :(得分:-2)

我这样做了:

        xtype: 'filefield',
        buttonOnly: true,
        listeners: {
            change: function (view, value, eOpts) {
                //  alert(value);
                var parent = this.up('form');
                parent.onFileChange(view, value, eOpts);
            },
            render: function () {
                this.fileInputEl.set({ multiple: true });
            }