sexta-feira, 15 de abril de 2011

responseXML

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