|
||
|
|
Conheça também: Onmasters . Ofertas . Divulgue! . Vai.la . Geraboleto . Baixa.la . Assista.la . Joga.la
» Início » Desenvolvimento » Ajax » Enviando um formulário POST com AJAX e PHP
--> |
|
Avaliação:
![]() ![]() ![]() ![]() | Publicado em: 20/07/2007Enviando um formulário POST com AJAX e PHP
Tiago Hillebrandt trabalha atualmente como desenvolvedor Web e professor. Tem conhecimentos em diversas tecnologias como AJAX, Delphi, C, Firebird/Interbase, MySQL, Access, Javascript, HTML, CSS, Java, Pascal, SQL e PHP. Trabalha também com ferramentas como Corel Draw, Photoshop, Dreamweaver e Flash. Atualmente está cursando Tecnologia em Sistemas de Informação na Universidade do Estado de Santa Catarina (UDESC).
Fala galera, tudo certo? Bom, hoje vamos montar uma simples aplicação de envio de formulário com método POST com AJAX e PHP. As explicações estão detalhadas nos comentários. Se você notar, a parte de códigos HTML não foi explicada, afinal, o objeto do formulário é ensinar a utilizar o AJAX. script.js var navegador = navigator.userAgent.toLowerCase(); //Cria e atribui à variável global 'navegador' (em caracteres minúsculos) o nome e a versão do navegador //Cria uma variável global chamada 'xmlhttp'
//Função que inicia o objeto XMLHttpRequest function objetoXML() { if (navegador.indexOf('msie') != -1) { //Internet Explorer var controle = (navegador.indexOf('msie 5') != -1) ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP'; //Operador ternário que adiciona o objeto padrão do seu navegador (caso for o IE) à variável 'controle' try { xmlhttp = new ActiveXObject(controle); //Inicia o objeto no IE } catch (e) { } } else { //Firefox, Safari, Mozilla xmlhttp = new XMLHttpRequest(); //Inicia o objeto no Firefox, Safari, Mozilla } }
//Função que envia o formulário function enviarForm(url, campos, destino) { //Atribui à variável 'elemento' o elemento que irá receber a página postada //Executa a função objetoXML() //Se o objeto de 'xmlhttp' não estiver true //Insere no 'elemento' o texto atribuído return; } else { //Insere no 'elemento' o texto atribuído } xmlhttp.onreadystatechange = function () { //Se a requisição estiver completada //Se o status da requisição estiver OK //Insere no 'elemento' a página postada } else { //Insere no 'elemento' o texto atribuído } } } //Abre a página que receberá os campos do formulário //Envia o formulário com dados da variável 'campos' (passado por parâmetro) } form.php <html> <head> <title>Enviando formulário POST com PHP e AJAX</title> <!-- Carrega o arquivo 'script.js' ao iniciar a página! //--> <script language="javascript" src="script.js" type="text/javascript"></script> </head> <body> <table cellpadding="2" cellspacing="0" width="50%"> <form action="processar.php" method="post" onsubmit="setarCampos(); enviarForm('processar.php', campos, 'divResultado'); return false;"> <tr><td>Nome</td><td><input name="txtNome" id="txtNome" type="text"></td></tr> <tr><td>Email</td><td><input name="txtEmail" id="txtEmail" type="text"></td></tr> <tr><td></td><td><input type="submit" value="Enviar"> <input type="reset" value="Limpar"></td></tr> </form> </table> <div id="divResultado"/>
<script> //Cria a função com os campos para envio via parâmetro function setarCampos() { campos = "txtNome="+encodeURI(document.getElementById('txtNome').value). } </script> </body> processar.php <?php //Determina o tipo da codificação da página //Extrai os dados do formulário //Verifica se algum nome foi digitado //Verifica se algum email foi digitado //Retorna com a resposta ?>
É isso aí galera! Quem quiser, pode baixar o exemplo pronto que está disponível em anexo. Qualquer dúvida entrem em contato comigo via email: Valeu! Abraço, Tiago Hillebrandt Arquivos anexos ao artigo
Carlos
Cara, muito bom sua matéria, curti pra caramba, eu precisava muito disso, agora eu fiz e deu tudo certo!
Valeu! ![]() ![]() ![]() ![]() ![]() Adriano <japo_ne_is@hotmail.com>
Otimo tutorial!!!! estava prescisando!!! abç
![]() ![]() ![]() ![]() ![]() Pedro
Show de bola o artigo!!!
Me ajudou pra caramba, valeu = ![]() ![]() ![]() ![]() ![]() Felipe <felipes@yahoo.com.br>
excelente!!
![]() ![]() ![]() ![]() ![]() Gilson <webmaster.gilson@gmail.com>
Muito bom, obrigado pela ajuda !!!!!
www.uchoa.web.br.com ![]() ![]() ![]() ![]() ![]() Felipe
excelente! =
![]() ![]() ![]() ![]() ![]() Rodrigo
Bastante objetivo, parabéns!
![]() ![]() ![]() ![]() ![]() Anderson
show de bola :D
![]() ![]() ![]() ![]() ![]() André B.
LoL
muito bom seu tuto...... ![]() ![]() ![]() ![]() ![]() wbinzao <wbinzao@hotmail.com>
cara foi fundo !!!
![]() ![]() ![]() ![]() ![]() Hugo <hugo_bixu@hotmail.com>
oi, eu baixei o zip com os ficheiros de exemplo e não funcionaram. Não alterei nada. Quando faço o submite o resultado que aparece é: "Olá desconhecido, seu email é: desconhecido" e não devia ser... O que verifico é que o _POST nao contem nada. Será que me pode ajudar? Cumprimentos, Hugo
![]() ![]() ![]() ![]() ![]() Allan <alanrein16@hotmail.com>
Mto bom o artigo!!!
Só preciso saber pq não funciona o & na separação das variáveis! abraços! ![]() ![]() ![]() ![]() ![]() Antonio Carlos <acdiasjunior@hotmail.com>
pra ajudar um pouco na recuperação dos dados do formulario:-)
function pegaVariaveis() { var variaveis = new Array('variavel1','variavel2',...'variavelN') ; var dados = new String ; var comprimento = variaveis.length ; for(i = 0; i < comprimento; i) { campo = variaveisi ; dados = campo "=" encodeURI(eval('document.form.' campo '.value')) ; if(i < (comprimento - 1)) { dados = "&" ; } } } Espero ter ajudado! Quebrei cabeça fazendo esse pequeno ajuste! ![]() ![]() ![]() ![]() ![]() TrueConan <lord_korjenioski@yahoo.com.br>
Ficou legal o processo porem a pagina processar.php só recebe os dados se colocar _GET com _POST nao funciona... baixei seu arquivo zipado para testar e continua igual... alguma ideia???
![]() ![]() ![]() ![]() ![]() Venilton <venilton@ig.com.br>
Tá dando erro na acentuação. Por exemplo, se no campo nome eu escrevo JOSÉ, quando clico no botão "Enviar" aparece JOSé. Já inclui na página form.php a linha "<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1">" mas não adiantou nada. Alguém sabe como resolver?
![]() ![]() ![]() ![]() ![]() Tiago Hillebrandt <tiagoscd@yahoo.com.br>
Você colocou este código no seu php?
//Determina o tipo da codificação da página header("content-type: text/html; charset=iso-8859-1"); ![]() ![]() ![]() ![]() ![]() Diogo
O colega, arruma seu artigo aí... Teu exemplo só dá "Olá desconhecido"...
Não está funcionando! s ![]() ![]() ![]() ![]() ![]() ![]() |
|
|