5

Preciso enviar dados de um formulário via ajax para o servidor (php). Eu utilizei o objeto FormData() mas sem sucesso. Parte do meu jquery:

var formdata = new FormData($("#myform"));
var link = "form/insert";
        $.ajax({
            type: 'POST',
            url: link,
            data: formdata ,
            processData: false,
            contentType: false

        }).done(function (data) {
            $("div.container-fluid").html(data);
        });

meu html tem:

<input type="text" class="form-control" id="name" placeholder="name" name="name">
 <input type="file" id="arquivo" name="arquivo" />

Ao executar o script só retorna null. Teria como enviar via ajax o input texto e o file?

5
  • 1
    Seu link está com a url correta? Commented 26/10/2015 às 23:29
  • Está sim! Na minha aplicação eu reescrevo o link. Eu recebo os dados perfeitamente no php (o problema é o envio do arquivo) Commented 26/10/2015 às 23:33
  • 1
    @BrunoNascimento sou dev c# mas vou tentar te ajudar hehehe', no c# eu faço da seguinte maneira. Olhe esse javascript
    – Brunno
    Commented 27/10/2015 às 0:22
  • @Brunno seu código está ok. Testei aqui e tudo certo. Sendo que eu ainda não consigo fazer upload do formulário junto com o file. Estou jogando o envio do file para o Callback. Mas, não queria fazer desta forma. Teria alguma dica? Commented 27/10/2015 às 0:49
  • @BrunoNascimento tente fazer da seguinte forma se der certo me avise que posto como resposta :)
    – Brunno
    Commented 27/10/2015 às 1:36

1 Resposta 1

19

Quando recuperar o form pode ser que retorne um vetor então pegue a chave 0 do mesmo (caso exista somente um).

Nota: Verifique se o enctype do form esta com o valor "multipart/form-data"

//Exemplo do JS
var formdata = new FormData($("form[name='nome_do_form']")[0]);
var link = "form/insert";
    $.ajax({
        type: 'POST',
        url: link,
        data: formdata ,
        processData: false,
        contentType: false

    }).done(function (data) {
        $("div.container-fluid").html(data);
    });

Exemplo do HTML:

<form name="nome_do_form" enctype="multipart/form-data">
     <input type="text" class="form-control" id="name" placeholder="name" name="name">
     <input type="file" id="arquivo" name="arquivo" />
     <input type="submit" />
</form>

Exemplo do PHP:

<?php

echo "Texto: " . $_POST['name'] . '<br/><br/>';

if (move_uploaded_file($_FILES['arquivo']['tmp_name'], __DIR__."/upload_".date('YmdHis')."_".$_FILES['arquivo']['name'])) {
        echo "Arquivo recebido {$_FILES['arquivo']['name']} - o seu tamanho é de  {$_FILES['arquivo']['size']}";
} else {
        echo "Falha ao fazer upload!";
}
5
  • @HiagoSousa e após o usuário selecionar como pode ser enviado esses dados selecionado para o mysql . Fica o meu caso tem como vê pt.stackoverflow.com/questions/181981/… Commented 3/02/2017 às 22:47
  • Excelente, valeu Commented 11/10/2017 às 22:52
  • Não estou conseguindo enviar FILE via AJAX, usei de acordo com esse exemplo e não funcionou.
    – Sr. Bigode
    Commented 5/03/2018 às 18:39
  • @DeveloperWebSistem... qual o S.O. você esta utilizando? Verificou as permissões de escrita na pasta onde deseja fazer o upload? Commented 25/04/2019 às 17:32
  • @HiagoSouza olá amigo, já resolvi o problema obrigado pelo feedback.
    – Sr. Bigode
    Commented 27/04/2019 às 12:30

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 .