Get byte array of file from filefield ExtJs

Question

Hello friends I have the following filefield:

{
    xtype:'filefield',
    buttonText: 'choose',
    buttonOnly: true,
    listeners: {
        change: function(fb, v) {
            // ...
        }
    }
}

and I want to get the chosen file in a byte array

Please help me if you can.

You mean.. you want to get the content of the selected file in a byte array? — Guilherme Lopes, Dec 10 '14 at 19:31
yes, i need display this image locally and ofter this send byte of array to server, i know form.sumbit is beter but i need this.. — Tato, Dec 10 '14 at 19:41

score 12 · Accepted Answer · answered Dec 10 '14 at 20:20

AFAIK Ext JS doesn't support that out of box, but you can easily implement that using JS File API. Example:

// file filed component reference
var filefield = [...];
// get file dom element
var file = filefield.getEl().down('input[type=file]').dom.files[0];
// create reader
var reader = new FileReader();
// create handler
reader.onload = (function(theFile) {
    return function(e) {
        // process file
        console.log(e.target.result);
    };
})(file);
// start upload
reader.readAsBinaryString(file);

Fiddle: http://jsfiddle.net/qjt6j0jv/2/

Get byte array of file from filefield ExtJs

1 Answers1