Jump to content
FabianoSouza

AJAX - Enviar form e string

Recommended Posts

Quero saber se é possível enviar formData e string na mesma requisição AJAX.

 

$frmData = new FormData($form);
$xhr.open('post', $form.getAttribute('action'), true);
$xhr.setRequestHeader('content-type', 'text/plain;charset=utf-8');

$xhr.send($frmData); //******* quero saber se consigo enviar sting, além do objeto formData.

 

Share this post


Link to post
Share on other sites

Cara, precisei fazer parecido hoje, olha como consegui enviar um arquivo e minhas strings.

var fileData = new FormData();
var file_data = [];

fileData.append('id_conta', 10);

$('input[type="file"]').each(function(){
	file_data = $('input[type="file"]')[0].files;
	fileData.append('arquivo[]', file_data[0]);
});

let request = $.ajax({
  url: "minha_url.php",
  type: "POST",
  data: fileData,
  contentType: false,
  processData: false,
});
request.done(function (data) {
	// retorno data
});

Aí no PHP recebo o $_POST e o $_FILES.

Share this post


Link to post
Share on other sites

Deixa eu ver se entendi...

var fileData = new FormData();
var file_data = [];

fileData.append('id_conta', 10);

@marcosmarcolin

No trecho acima você está atachando (id_conta, 10)  ao objeto form, certo?

Não entendi isso... você atacha uma string direto ao "corpo" do objeto form? Quero entender só a lógica da coisa (pois não manjo de JQuery, uso JS puro).

Share this post


Link to post
Share on other sites

Olá Fabiano,

 

Bem acredito que você terá que tratar tudo dentro do formato de envio especifico seja 

$xhr.setRequestHeader('content-type', 'text/plain;charset=utf-8');

ou

xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

 

Terá que tratar os parametros juntos, se precisa de uma string junto com o Form coloque o valor que precisa dentro de um hidden field, se for Json ou outro formato... adicione junto dos parametros. E dependendo você pode adicionar esse valor na url e recuperar via get do lado que receber.

 

Enfim... se entendi corretamente o que precisa... talvez o que falei acima possa lhe ajudar.


Até!

Share this post


Link to post
Share on other sites

Olá @Uerlen Santos. Obrigado pelas sugestões.

 

Estou enfrentando problemas com truncamento de caracteres acentuados no lado servidor.

Abri mão da abordagem de recuperar o valor dos campos (no lado servidor) da forma convencional pelo motivo acima.

 

Então estou pensando em outra abordagem: enviar o formData (que levará um arquivo anexo) e enviar texto "fora do objeto formData", mas no mesmo momento em que envio o formData por AJAX. Não sei se isso  dará certo...preciso testar.

 

Quanto a enviar o valor na URL eu também pensei. Fiz uns testes mas aí o texto chega mas form não vai. Vou explorar mais essa possibilidade.

 

Valew!

Share this post


Link to post
Share on other sites
5 horas atrás, FabianoSouza disse:

Deixa eu ver se entendi...


var fileData = new FormData();
var file_data = [];

fileData.append('id_conta', 10);

@marcosmarcolin

No trecho acima você está atachando (id_conta, 10)  ao objeto form, certo?

Não entendi isso... você atacha uma string direto ao "corpo" do objeto form? Quero entender só a lógica da coisa (pois não manjo de JQuery, uso JS puro).

 

Isso, o ('id_conta', 10) passei fixo apenas para o exemplo, mas eu envio os dados do meu formulário no lugar. Eu pego o valor do campo 'id_conta' e demais campos do meu formulário e adiciono no meu FormData(append), e depois por fim o anexo do campo 'File' do formulário, entendeu?

 

Na requisição eu envio apenas o FormData, que terá os campos que estou passando e o meu anexo. Aí lá no PHP recebo o anexo na global $_FILES e os demais valores em $_POST, que é o tipo da requisição Ajax.

 

Lá no PHP eu recebo $_POST['id_conta'] que será 10.

Share this post


Link to post
Share on other sites

@FabianoSouza os caracteres acentuados estão aparecendo como simbolos?

Se for... o problema é na codificação dos dados... Normalmente é utilizado UTF8... 

Não qual linguagem utiliza no lado do server... mas a maioria oferece um encoder/decoder para esses formatos.

Em php por exemplo é: 

https://www.php.net/manual/pt_BR/function.utf8-encode.php

 

Share this post


Link to post
Share on other sites

Olá @Uerlen Santos.
Meu amigo, fazendo uns testes aqui parece que enviado a string pela URL parece que resolve o meu problema de caracteres especiais truncados. Vou explorar mais para poder confirmar essa impressão.

 

Quanto ao problema de codificação é o seguinte. Uso ASP Clássico, já defini como UTF8 todos os manipuladores de cabeçalho suportados pela linguagem mas não resolveu.

 

  Response.AddHeader "Content-Type", "text/html;charset=UTF-8"
  Response.Charset = "UTF-8"

 

Uma pergunta quanto a enviar dados pela URL. Sabe dizer se há algum tipo de limite de caracteres?

Pergunto isso porque em meu formulário há um campo para comentários...para até 1.000 caracteres.

Share this post


Link to post
Share on other sites

Olá @FabianoSouza

Existe alguma necessidade do arquivo que está enviando possuir o mesmo nome de quando é enviado?

 

Porque eu vejo a seguinte situação:

  • Usuário A envia um arquivo com o nome iMasters.jpg
  • Usuário B também envia um arquivo iMaster.jpg mas a imagem é diferente da anterior

Logo o usuário B vai substituir o arquivo do usuário A no servidor.

 

5 horas atrás, FabianoSouza disse:

Uma pergunta quanto a enviar dados pela URL. Sabe dizer se há algum tipo de limite de caracteres?

Pergunto isso porque em meu formulário há um campo para comentários...para até 1.000 caracteres.

Isso eu não sei dizer até fiquei curioso a respeito. Mas já enviei post com muito mais de 1.000 caracteres.

Share this post


Link to post
Share on other sites
Em 26/06/2019 at 06:14, Omar~ disse:

Olá @FabianoSouza

Existe alguma necessidade do arquivo que está enviando possuir o mesmo nome de quando é enviado?

 

Porque eu vejo a seguinte situação:

  • Usuário A envia um arquivo com o nome iMasters.jpg
  • Usuário B também envia um arquivo iMaster.jpg mas a imagem é diferente da anterior

Logo o usuário B vai substituir o arquivo do usuário A no servidor.

 

Isso eu não sei dizer até fiquei curioso a respeito. Mas já enviei post com muito mais de 1.000 caracteres.

Respondendo a sua pergunta.

Os arquivos serão renomeados (com o id do registro salvo no banco de dados).

Share this post


Link to post
Share on other sites
Em 24/06/2019 at 20:09, marcosmarcolin disse:

 

Isso, o ('id_conta', 10) passei fixo apenas para o exemplo, mas eu envio os dados do meu formulário no lugar. Eu pego o valor do campo 'id_conta' e demais campos do meu formulário e adiciono no meu FormData(append), e depois por fim o anexo do campo 'File' do formulário, entendeu?

 

Na requisição eu envio apenas o FormData, que terá os campos que estou passando e o meu anexo. Aí lá no PHP recebo o anexo na global $_FILES e os demais valores em $_POST, que é o tipo da requisição Ajax.

 

Lá no PHP eu recebo $_POST['id_conta'] que será 10.

@marcosmarcolin sua dica foi ótima! Entendi o conceito e apliquei.

 

Fiz dessa forma e resolveu o meu problema.

	$frmData.append('id',$idItem)

 

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Similar Content

    • By fideles
      Mais uma vez venho aqui pedir ajuda a vocês.
       
      Tenho um formulario que criei aqui na empresa algo bem simples, somente para sair das planilhas de excel, que seria cadastro de funcionarios.
       
      Tem os campos, matricula, nome completo, unidade de trabalho, endereço e telefone de emergencia.
       
      A parte do formulario funciona, a gravação no BD tbm, listar as informações também, ai me perguntaram se era possível um auto preenchimento dos campos colocando somente a matricula do funcionario e respondi que eu não sei porque realmente não sei.
       
      A ajuda que eu preciso de vocês seria, é possível fazer isso ? Colocar a matricula e vir do banco e preencher os outros inputs? Se sim, é possível me derem um exemplo de como funciona e eu estudar o codigo e colocar nos outros inputs.
       
      Obrigado antecipadamente. 
       
    • By Authent
      Gente tenho um laço de repetição onde exibi uma lista , nele contem um botão para atualizar o nível desses itens, porem queria que a pagina não desse refresh e ao mesmo tempo enviasse uma msg para o "TD" daquele item atualizado, e utilizei o Ajax que envia no metodo post o id, porem ele está enviando só o ultimo id da lista alguem poderia me ajudar. Abaixo explicarei melhor
       
      while($row = $select->fetch(PDO::FETCH_ASSOC)): ?> <tbody> <tr> <td><?php echo $row['nome'];?></td> <td><?php echo $row['data'];?></td> <td class="contador<?php echo $row['id']; ?>"> <ul class="actions"> <li><a href="" id="<?php echo $row['id'];?>" class="ative btnUpdate"><i class="fas fa-check"></i> Atualizar</a></li> </ul> </td> </tr> </tbody> <form class="ajax_form"> <input type="hidden" class="id" name="id" value="<?=$row['id']?>" /> </form> <?php endwhile; ?> Nesse laço de repetição eu adicionei um td com uma class ID, para que a msg enviada fosse só para aquele td, até ai esta funcionando normal
      e o link que contem o ID = id, e um formulario dentro do while, e o valor do input é o valor do id
       
      <script> $(document).ready(function(){ $("body").delegate('.btnUpdate', 'click', function(e){ e.preventDefault() //Para anular o comportamento padrão do link var dados = $(".ajax_form").serializeArray(); var id = $(this).attr("id"); var contador = id; $.ajax({ url: "action/test.php", type: "POST", data: dados, success: function (resultado) { console.log(resultado); $('.contador'+contador+'').html(resultado); }, error: function (jqXHR, textStatus, errorThrown) { alert(jqXHR) console.log(jqXHR); } }); }) }); </script> e no script do Ajax ele recupera os dados, e enviar uma msg de sucesso para a class .contador+id(nessa parte está funcionando perfeitamente), porem como mencionado o id que está sendo enviado para o arquivo test.php é sempre o ultimo id do meu while alguem poderia me ajudar. se houver outro método estou aceitando também
    • By FabianoSouza
      Pessoal, qual a forma correta de enviar emoji por AJAX ao meu backend?
       
      Tem que usar:
      encodeURIComponent(minhaString) ??
      Quando envio uma string que tem texto junto com emoji,  meu código não funciona.
      Quando envio apenas o emoji, vai um código meio louco para o backend.
       
      Qual a maneira correta de tratar isso?
      Seria separar texto de emoji para enviar, e no backend juntar tudo novamente para poder gravar no banco?
       
      Preciso entender conceitualmente qual é a melhor forma de tratar essa situação, depois partir para a programação.
       
      Já fiz os testes do meu banckend: grava emoji com texto direitinho.
      O problema está realmente no meu frontend. Preciso saber como devo fazer o POST dos dados.
       
      Valew!!
       
       
    • By kaayasinho
      Boa tarde Pessoal tudo bom?
      Durante um tempo eu fui estudante de programação, para web. E esse forum me foi muito util pois aprendi muitas coisas, e tirei muitas duvidas com todos os participantes. Por outro lado não segui a carreira de programado pois tive outras oportunidades.
       
      Em fim, estou com um projeto de criar uma plataforma online para eventos, e estou tentando montar um time chegar nesse objetivo. Por hora ainda estou tentando juntando a equipe necessária para isso acontecer.
       
      Pela pouca experiência que tive na programação, sei que fazer essa plataforma é bem complexa principalmente com as necessidades que vamos englobar, porém o mercado esta escasso de plataformas flexíveis, no sentido de oferecer algumas ferramentas básicas na comunicação. apesar de ja existir algumas plataformas no mercado.
       
      Resumo:
      1-) Procuro por programadores backend com experiência (não sei exatamente informar a linguagem) mas chuto que Java, Javascript e PHP sejam fundamentais. (sei que abusaremos muito do AJAX)
       
      2-) Programador FrontEnd, com experiência. E que tenha principalmente em boas praticas, pois código sujo cheio de plugins tornará a plataforma pesada, e cheia de bugs.
       
      PS: Não procuro nada pronto, claro que plugins coisas são inevitáveis porém para funcionarmos Lisos com menos bugs possíveis procuro algo feito “artesanalmente” rsrs.
       
      Obs: o projeto esta no inicio ainda, estou juntando contatos para chegar no objetivo, e assim que tiver um contato gostaria de poder conversar trocar ideias, caso seja um projeto onde você se identifique nada impede de sermos parceiros ter uma % sobre o negocio.
       
       
      Obs2: Desculpem se escrevi meio enrolado ou esta complicado de entender. pois apenas disse plataforma de eventos e não especifiquei nada. mas assim que receber um contato eu passo mais informações com alguns links de exemplos, que é melhor que falar.
       
      E caso aqui seja o lugar correto posso passar mais informações por aqui também.
       
      Seguem alguns exemplos de plataforma de eventos online.
      Download de 2 PDFs de apresentações do mesmo segmento
       
      Site de uma das plataformas porém proximo do que almejamos
      https://www.swaper.com.br/
       
       
      Fico a disposição,
       
      Desculpem se postei no local incorreto
       
    • By Rafael Castelhano
      Olá, nunca fiz consulta com Ajax e estou quebrando a cabeça para atualizar um campo no Django, tenho um template de funcionário e assim que selecionar a matricula quero que busque via ajax o nome do funcionário, segue no link meus arquivos, se alguém puder ajudar agradeço:
       
      https://gist.github.com/castelhano/dcbdbd6bef0d0012efddae544224a5a5
×

Important Information

Ao usar o fórum, você concorda com nossos Terms of Use.