Save an image inside a directory Extjs

Question

I have this code for previewing images:

{                           
  xtype: 'filefield',
  x: 120,
  y: 130,
  width: 490,                        
  //buttonOnly: true,
  name: 'rutas',
  itemId: 'rutas',
  labelWidth: 90,                                                       
  fieldLabel: 'Buscar Foto',  
  listeners: {
    'change': function (newVal) {                                    
      var file = newVal.fileInputEl.el.dom.files[0];
      var reader = new FileReader();
      console.log(reader);
      reader.readAsDataURL(file);
      reader.onload = function (evt) {
        var image = Ext.ComponentQuery.query("[itemId=imageid]")[0];
        image.setSrc(evt.target.result);                                                                            
      }
    }
  },                     
},

and I set a place where the image is being display:

{
  xtype: 'image',
  x: 20,
  y: 5,
  itemId: 'imageid',
  style: "border: 1px solid black",
  minHeight: 90,
  width: 65,
  height: 'auto',
  //html:'<div align="center" style="background-color:white;" ><img src="http://src.sencha.io/http://yoursite.com/splash.png" ></div>',
  src: 'tmp/default.png'                            
},

These code is working fine but I need to save the selected image into a directory in my app. Someone knows how to do it ?

I have read a book which says that with setSrc you can move files into directories but I don´t really have any clue about how to do it.

Answer 1

Please have a look of fiddle url given below:-

https://fiddle.sencha.com/#view/editor&fiddle/2f70

Currently I am not sure about how we can set location (where to download).