-1

Estou tentando fazer o upload de imagens via AJAX e PHP, porém sem sucesso. Já revisei, atualizei, enfim, os códigos batem com todos os outros códigos que eu pesquisei, eu realmente não estou entendendo.

HTML:

<form class="photo_change" method="post" enctype="multipart/form-data">
                <input class="arquivo" name="img" type="file" />
                <input type="submit" class="img_envia" name="envia_img" value="SELECIONAR IMAGEM" />
                <img style="display: none; width:22px; height: 22px; margin-left:10px;" src="/img/loader.gif" /> </form>

Jquery:

$('.img_envia').click(function(){
                    $('.arquivo').trigger('click');
                    return false;
});
 
                $('.arquivo').change(function() {
                  var fileName = $(this)[0].files[0].name;
                  var formData = new FormData($('.photo_change'));
                  $('#modal_photo_content form img').show();
 
                      $.ajax({
                        url:'http://localhost/photo_change.php',
                        type: 'POST',
                        data: formData,
                        processData: false,
                        contentType: false,
                        success: function(data){
                            console.log(data);
                            $('.img_envia').removeAttr('disabled','disabled');
                        },
                        error: function() {
                            $('.img_envia').removeAttr('disabled','disabled');
                            alert("ERRO: Tente novamente mais tarde.");
                        }
                      });
 
                });

E no PHP eu estou dando um var_dump na variável $_FILES e no $_POST para ver se estou recebendo algo, mas o retorno é sempre o da foto: console log

1 Resposta 1

2

O FormData suporta apenas o <form> no construtor.

Se o .photo_change é o form, penso que podes fazer, nota que tem o [0] visto que o FormData espera o elemento HTML e nao o objecto jQuery.

var formData = new FormData($('.photo_change')[0]);

Ou, podes usar o append.

var theFile = $(this)[0].files[0];
var fileName = theFile.name;
var formData = new FormData();
formData.append(fileName, theFile);
2
  • 1
    Obrigado. Muito objetivo. :) Prefiro a primeira maneira, já que a validação no PHP fica mais fácil. Commented 26/06/2018 às 0:28
  • 1
    var formData = new FormData($('.photo_change').get(0)); Essa opção também faz a mesma coisa. Commented 26/06/2018 às 0:31

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .