Boa madrugada corujas, o café está quente?
Hoje em dia em incomum entrar em algum site e não reparar alguma funcionalidade que utiliza da tecnologia AJAX. Quase todos usam ou pelo menos deveriam usar, mas não estou aqui para debater sobre isso e nem para definir o que é o AJAX e como deve ser aplicado, como o objetivo do blog é ser específico em dar soluções, vamos lá.
De saco cheio de ter que ficar colocando flags e manipulando strings retornadas do objeto responseText do ajax resolvi me aventurar a usar o objeto responseXML, o que não é difícil se você compreende bem o que é XML, entretando me perdi em um detalhe idiota e perdi um bom tempo quebrando cabeça procurando erros em meu código. Como um programador que se preze é a primeira coisa que olhamos é o nosso fonte em busca de erros de sitaxe caudos pela mórbida distração. Mas o erro quase sempre está debaixo de nosso narizes.
Bem vou então fazer um exemplo simples de uma requisição ajax em que retornaremos um xml para recuperarmos com o objeto responseXML...
OBS: utilizo o framework prototype pois agiliza e facilita o process. Quem quizer experimentar segue o ink para o download e documentação.
http://www.prototypejs.org/
Vamos ao que interessa. O código...
A ideia é simples, faremos uma requisição ajax passando algum parâmetro e dado esse parâmetro teremos um retorno... Estou explicitando isso de maneira genérica para que você fique a vontade para aplicar o conceito em qualquer aplicação que vá desenvolver, ou seja: que buscar por livros, informe um ISBN e receba de resposta o título do livro, ou o cpf de alguém, enfim... Isso é problema seu ! ! !
Para o nosso exemplo informarei o nome de um time de futebol e terei como retorno o nome dos jogadores do time...
Criaremos o arquivo ajax.js com o seguinte conteúdo
function ajaxRequest(){
Ajax.Request("ajax.php",
{
method : get
parameters : {time : "flamengo"},
onSuccess : function(transport){
var response = transport.responseXML;
div.innerHTML = response.getElementsByTagName("jogador")[0].childNodes[0].nodeValue);
div2.innerHTML = response.getElementsByTagName("jogador")[1].childNodes[0].nodeValue);
.
.
.
divN.innerHTML = response.getElementsByTagName("jogador")[N].childNodes[0].nodeValue);
}
});
}
Agora criaremos o arquivo que recebera a requisição do ajax que se chamará ajax.php. Repare que este arquivo foi passado como parâmetro quando invocamos o método Request. (Esta é a página responsável pelo processamento no servidor).
ajax.php
//armazena o parâmetro recebido via get em uma variável
$time = $_GET["time"];
//Aqui você faz a busca em um banco de dados ou em qualquer outra fonte de dados que tenha para montar os resultados e então monta o seu xml para retornar...
echo "<?xml version='1.0' encoding='UTF-8'?>";
echo"<time>";
while(Tenho resultado){
$meuJogador = $resultado[index];
<jogador>$meuJogador</jogador>
}
echo"</time>";
...
Bem galera... Não está muito mastigado mas o conceito está aplicado e é bem simples de ser compreendido... crie uma função em um arquivo javascript que vai conter a requisição ajax, em alguma parte de sua página chame essa função passando um parametro de busca para obter determinado resultado, faça a requisição ao servidor, receba e trate esse resultado.
Por falar em tratar o resultado, você pode fazer isso dinamicamente, não é uma boa prática como está feito em meu exemplo, mas lembre-se que é só um exemplo.
E antes que eu me esqueça... no início do post havia mencionado que estava quebrando a cabeça para resolver um problema mais simples que pensei... Quando retornava a resposta xml, o ajax a recebia como null, pois o header do meu arquivo ajax.php estava como content:text/html, basta altera-lo para content:text/xml que da tudo certo...
Abraços e até a próxima madrugada de programação...
Nenhum comentário:
Postar um comentário