[Resolvido] Enviar arquivo EXTJS

[Luis Paullo 47]

Salve pessoal seguinte..

 

to com um sistema Extjs em MVC..

 

Tava tudo ok até eu tenta enviar um arquivo .. Simplismente não consigo recupera o arquivo

no PHP.

 

Meu extjs

////  View 
//ta assim campo q envia o arquivo
{
	inputType:'file',
	allowBlank: true,
	name: 'img-file',
               fieldLabel: 'Add Imagem'
           }

STORE.js

meu store ta assim
....
proxy: {
       simpleSortMode: true,
       type: 'ajax',
       api: {
           read: 'noticia.php',
           create: 'noticiaInsert.php',
           update: 'noticiaAction.php?action=update',
           destroy: 'noticiaAction.php?action=delete'
       },
       actionMethods: {
           read: 'POST',
           create: 'POST',
           update: 'POST',
           destroy: 'POST'
       },  
       reader: {
           type: 'json',
           root: 'data',
           successProperty: 'success'
       },
       writer: {
           type: 'json',
           writeAllFields: true,
           encode: true,  
           root: 'data'
       },
       extraParams: { 
           start : 'start',   
           limit : 'limit',  
           sort : 'nome',    
           dir : 'ASC', 
           total:'total' 
       }, 

meu php ta assim

 

//recebe os dados vindo do Formulario.. e decodifica

$obj = json_decode($_REQUEST['data'],true);

 

eu tenho que descodificar os POST..

funciona normal com todos campos

 

mais qndo é o arquivo simplismente manda o name'img-file' em branco.

 

num consigo pega nenhum $_FILES['img-file'] no meu php

 

alguem sabe como posso resolve.

 

desde já agradeço

[JCMais 75]

você poderia passar a view completa? Porque não dá para saber se está usando um form ou o campo diretamente...

 

So um detalhe, o xtype para o campo de upload de arquivos é filefield ou fileuploadfield (http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.field.File) e não existe proprieadade fieldType.

[Luis Paullo 47]

opa ta ae

 

abstract combo e form não tem nd alem de configs simples

 

abstract window tem os botões que submit meu form

Abstract Windows:

Ext.define('Admv2.view.AbstractWindow',{
   extend: 'Ext.window.Window',
   alias: 'widget.abstractwindow',
   title: 'Edição',
   layout: 'fit',
width: '',
   autoShow: true,
   modal: true,

   initComponent: function(){

       this.buttons = [{
           text: 'Salvar',
           action: 'save',
           iconCls: 'save'
       },
       {
           text: 'Cancelar',
           scope: this,
           iconCls: 'cancel',
           handler: this.close
       }];

       this.callParent(arguments);
   }
});

 

meu views form

View:

Ext.require(['Admv2.view.AbstractForm']);
Ext.require(['Admv2.view.AbstractWindow']);	
Ext.require(['Admv2.view.noticia.Combo']);	

Ext.define('Admv2.view.noticia.Edit', {
   extend: 'Admv2.view.AbstractWindow',
   alias : 'widget.noticiaEdit',
   title : 'Edição Noticias',
width:600,
maximizable: true,

   initComponent: function() {

       this.items = [{
           xtype: 'abstractform',
           items: [{
                name : 'nome',
                fieldLabel: 'Nome'

          	 },{ xtype:'noticiaCombo' },{

//upload
	          xtype: 'fileuploadfield',
	          emptyText: '',
	          fieldLabel: 'Thumb Image',
	          buttonText: 'Select a File',
	          name: 'ufile',
	          id: 'form-file-3'
	 },{ 
                xtype: 'htmleditor',
		flex: 1,
		labelAlign: 'top',
                height: 300,
		name: 'text',
                fieldLabel: 'Texto'

           }
        ]}
       ];

       this.callParent(arguments);
   }
});

 

Controllers:

Ext.require('Ext.window.MessageBox');

Ext.define('Admv2.controller.Noticia', {
   extend: 'Ext.app.Controller',
   stores: ['Noticias'],
   models: ['Noticia'], 

   views: [
   'noticia.List',
   'noticia.Edit'
   ],

   refs: [
   {
       ref:'noticiaEdit', 
       selector:'noticiaEdit'
   },
   {
       ref:'noticiaList', 
       selector:'noticiaList'
   }
   ],

   init: function() {
       this.control({
           'noticiaList': {
               itemdblclick: this.edit
           },

           'noticiaList button[action=insert]': {
               click: this.insert
           },

           'noticiaList button[action=edit]': {
               click: this.edit
           },

           'noticiaList button[action=destroy]': {
               click: this.destroy
           },

           'noticiaList button[action=refresh]': {
               click: this.refresh
           },

           'noticiaEdit button[action=save]': {
               click: this.save
           }
       });
   },

   disparandoNossoEvento: function(){
       console.log('Evento customizado detectado');
   },

   refresh: function(){
       this.getNoticiaList().store.load();
   },

   insert: function(btn, evt, opt) {
       var view = Ext.widget('noticiaEdit');
       view.setTitle('Inserindo nova Noticia');
   },

   destroy: function() {

       var grid    = this.getNoticiaList(),
           records = grid.getSelectionModel().getSelection();

       if(records.length === 0){
           Ext.Msg.alert('Atenção', 'Nenhum registro selecionado');
           return false;
       }else{
           Ext.Msg.show({
               title : 'Confirmação',
               msg : 'Tem certeza que deseja deletar o(s) registro(s) selecionado(s)?',
               buttons : Ext.Msg.YESNO,
               icon : Ext.MessageBox.WARNING,
               scope : this,
               width : 450,
               fn : function(btn, ev){
                   if (btn == 'yes') {
                       var store = this.getNoticiaList().store;
                       store.remove(records);
                       this.getNoticiaList().store.sync();
                   }
               }
           });
       }
   },

   save: function(button, evt, opt) {	

       var win     = button.up('window'),
           form    = win.down('form').getForm(),
           id      = form.getRecord() ? form.getRecord().get('id') : 0;

       if (form.isValid()) {
           var record = form.getRecord(),
               values = form.getValues();

           if (record){
               if(record.data['id']){
                   record.set(values);
               }
           } else{
               var record = Ext.create('Admv2.model.Noticia');
               record.set(values);
               this.getNoticiaList().store.add(record);
           }

           win.close();
           this.getNoticiaList().store.sync();
       }else{
           Ext.ux.Msg.flash({
               msg: 'Há campos preenchidos incorretamente',
               type: 'error'
           });

       }

   },

   edit: function(){

       var records = this.getNoticiaList().getSelectionModel().getSelection();    	

       if(records.length === 1){
           var editWind = Ext.widget('noticiaEdit');    	
           var editForm = editWind.down('form');
           var record = records[0];
           editForm.loadRecord(record);
       }else{
           return;
       }		
   }

});

 

mais importante do store ta no topic acima

 

fico meio grande o topic =X .. mais to realmente precisando faze essa upload funciona :(

 

Pensei no caso de fazer tudo direto pela Views..

 

ao invez de passa pra controller o envio dos dados .. joga um "form.submit()", na propria views..

 

sera q teria como?

[JCMais 75]

Pensei no caso de fazer tudo direto pela Views..

 

Pegue este pensamento, o amasse, e jogue-o na lixeira. :P

 

sera q teria como?

 

Ter tem, mas seria o correto?

Re: Não.

 

Você deve seguir o padrão MVC, e quem deve controlar o fluxo de sua aplicação é algum Controller. Neste caso o Admv2.controller.Noticia.

 

Agora que você mudou o xtype, o que o PHP recebe, continua a receber uma array vazia?

O Console do firefox exibe algum erro? O campo exibido no formulário realmente é um campo de upload? Tem algum exemplo online?

[Luis Paullo 47]

=X vai sai do padrão MVC msm

 

o firebug m retorna isso

 

data	[{"id":"","idCateg":2,"nome":"nome","nomeCateg":"","text":"\u200bsdfadfasdfasdfasdfasdfasd","tags":"","categoria":"","status":"0","ufile":"","data":""},{"id":"","idCateg":2,"nome":"asdaSDAsdaSD","nomeCateg":"","text":"\u200bSADFASDFASDFASDFASDF","tags":"","categoria":"","status":"0",   "UFILE":""   ,"data":""}]
dir	ASC
limit	limit
sort	nome
start	start
total	total

 

problema acho q está no fato que eu passo os dados via POST decodificado... sei la =X

 

O 'UFILE' destaquei la so pra mostra..

 

ele continua vindo fazio..

 

eu poderia despara um evento novo na controller fazendo o submit(). problema q so iniciante ainda num sei como ficaria isso

 

minha ideia seguinte..

 

VIEW.
this.buttons = [{
           text: 'Salvar',
           action: 'UPLOAD',
           iconCls: 'save'
       }
CONTROLLER

init: function() {
       this.control({


          'noticiaList button[action=UPLOAD]': {
               click: this.disparaUpload
          }, ....
// aqui seria o submit novo porem .. eu num sei como faze aqui
disparaUpload: function()

var form = this.up('form').getForm();
                   form.submit({
                       url: 'upload.php',
                       waitMsg: 'Sending Data',

 

seria nessa Controller que postei no topic acima.. disparando um evento personalizado

 

como que faço essa function() funcion?

[JCMais 75]

Man, desculpa mas não entendi direito. Você gostaria de disparar uma função quando o evento de envio do form fosse ativado, é isso?

[Luis Paullo 47]

queria faze um evento que envia os dados =X

 

eu ja tenho um so que ele num manda o FILES.. então faço outro diferente..

 

olha a função de save(submit).

    save: function(button, evt, opt) {	

       var win     = button.up('window'),
           form    = win.down('form').getForm(),
           id      = form.getRecord() ? form.getRecord().get('id') : 0;

       if (form.isValid()) {
           var record = form.getRecord(),
               values = form.getValues();

           if (record){
               if(record.data['id']){
                   record.set(values);
               }
           } else{
               var record = Ext.create('Admv2.model.Noticia');
               record.set(values);
               this.getNoticiaList().store.add(record);
           }

           win.close();
           this.getNoticiaList().store.sync();
       }else{
           Ext.ux.Msg.flash({
               msg: 'Há campos preenchidos incorretamente',
               type: 'error'
           });

       }

   }

 

num achei nd sobre envia arquivo em MVC no Extjs..

[JCMais 75]

Certo, você postou o seu store, mas cadê a sua Model?

[Luis Paullo 47]

ta ai

Ext.define('Admv2.model.Noticia', {
   extend: 'Ext.data.Model',
   fields: [
    { name: 'id' },
	{ name: 'idCateg' },
	{ name: 'nome', type: 'string' }, 
	{ name: 'nomeCateg', type: 'string'},
	{ name: 'text', type: 'string' }, 
	{ name: 'tags', type: 'string'},
	{ name: 'categoria', type: 'string'}, 
	{ name: 'status'},
	{ name: 'ufile'}, // o campo do file
	{ name: 'data'}
   ]
});

 

ta dificil recupera esse danado do FILE no meu php =X

[JCMais 75]

Tá me parecendo problema com o teu store e o campo, você já tentou fazer um envio normal, sem usar o store? APenas enviar os dados para determinada url e verificar se recebe os dados?

 

Veja: http://loianegroner.com/2011/07/extjs-4-file-upload-spring-mvc-3-example/

[Luis Paullo 47]

sem passa pelo store eu pego.. =(

 

direto na views fiz assim :

 

quero passa isso pra um evento na Controllers agora

   this.buttons = [{ 
			text: 'Save',
			iconCls: 'save',
               handler: function() {
				 var win     = this.up('window'),
             			 form    = win.down('form').getForm()
                   form.submit({
                       url: 'noticiaInsert.php',
                       waitMsg: 'Sending Data',
                       success: function(form, o) {
                           alert(o.response.responseText);
                       }
                   });
			}
		},{
           text: 'Cancelar',
           scope: this,
           iconCls: 'cancel',
           handler: this.close
       }];

[Luis Paullo 47]

Resolvido *______*

 

fiz assim no meu controller

 

save: function(button, evt, opt) {	

       var win     = button.up('window'),
           form    = win.down('form').getForm(),
           id      = form.getRecord() ? form.getRecord().get('id') : 0;

		 if (form.isValid()) {

			 var  record  = form.getRecord(),
				  values  = form.getValues();

			if(record){
				var u = 'uploadNot.php?action=update'; 
				 console.log('to no update');
			}else{
				var  u = 'uploadNot.php';
				 console.log('to no insert');
			}
			 form.submit({
				 methods:'POST',
                                 url: u,
				      success: function....