(Resolvido) Parâmetro de função Ajax só funciona no IE

Paulada · Julho 20, 2009

Olá a todos

Este é o meu primeiro post neste fórum que já há tempos utilizo para consulta, porém agora chegou minha vez de postar aqui. Vou ser objetivo.

Comprei o livro "Web Interativa com Ajax e PHP" do escritor Juliano Niederauer e descobri alguns bugs. Entrei na página do autor, lhe enviei um email, mas ele não respondeu. Por isso, gostaria de resolver uma dúvida se puderem me ajudar.

Logo abaixo seguem 4 arquivos, um xml, um html e dois js. Sua execução é bem simples. Você executa a página html e ela usa o arquivo exemplo2.js para buscar informações no arquivo teste.xml e trazer para a tela no arquivo exemplo2.html. Este processo funciona perfeitamente no Internet Explorer, mas não no Firefox. Segundo o plugin Firebug do Navegador Firefox o erro está na linha 4 do arquivo exemplo2.js ( var raiz = documentoXML.getElementsByTagName('raiz').item(0);\n).

Enfim, como executar isso corretamente no Firefox?

Arquivo exemplo2.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRansitional//EN"
"http://www.w3.org/TR/html14/loose.dtd">

<html>

    <head>
        <title>Web Interativa com Ajax</title>

        &lt;script type="text/javascript" src="bibliotecaAjax.js"></script>
        &lt;script type="text/javascript" src="exemplo2.js"></script>

        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

    </head>

    <body>

        <h2>Lendo uma resposta XML </h2>
    	<form action="java script:void%200" onSubmit="requisicaoHTTP('GET','teste.xml',true); return false">
			<p><input type="submit" name="Testar" value="Testar"> <span id="campoResposta"></span></p>
		</form>
    </body>

</html>

Arquivo exemplo2.js

function trataDados()
{
    var documentoXML = ajax.ResponseXML;    //  obtém a resposta como XML
    var raiz = documentoXML.getElementsByTagName('raiz').item(0);
    var info = raiz.firstChild.data;
    document.getElementById("campoResposta").style.backgroundColor="yellow";
    document.getElementById("campoResposta").innerHTML=info;
}

Arquivo teste.xml

<?xml version="1.0" ?>
<raiz>
    Isto é um teste.
</raiz>

Arquivo bibliotecaAjax.js

var ajax;
var dadosUsuario;


//------------- cria o objeto e faz a requisição ------------
function requisicaoHTTP(tipo,url,assinc)
{
    if(window.XMLHttpRequest)
    {
        ajax = new XMLHttpRequest();    // Mozilla, Safari,...
    }
    else
        if(window.ActiveXObject)    //IE
        {
            ajax = new ActiveXObject("Msxml2.XMLHTTP");

            if(!ajax)
            {
                ajax = new ActiveXObject("Microsoft.XMLHTTP");
            }
        }

    if(ajax) // iniciou com sucesso
    {
        iniciaRequisicao(tipo,url,assinc);
    }
    else
    {
        alert("Seu navegador não pussui suporte a essa aplicação!");
    }
}

//------------- Inicializa o objeto criado e envia os dados (se existirem) -----
function iniciaRequisicao(tipo,url,bool)
{
    ajax.onreadystatechange = trataResposta;
    ajax.open(tipo,url,bool);
    if(window.XMLHttpRequest)
    {
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=UTF-8");
        ajax.overrideMimeType("text/XML");    /* usado somente no Mozilla */
    }
    else
    {
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=UTF-8");
    }
    ajax.send(dadosUsuario);
}

// ------------ Inicia requisição com envio de dados -------------
function enviaDados(url)
{
    criaQueryString();
    requisicaoHTTP("POST",url,true);
}

// ------------ Cria a string a ser enviada, formato campo1 = valor1&campo2=valor2... -------
function criaQueryString()
{
    dadosUsuario="";
    var frm = document.forms[0];
    var numElementos = frm.elements.length;

    for(var i = 0; i < numElementos; i++)
    {
        if(i < numElementos-1)
        {
            dadosUsuario += frm.elements[i].name+"=" + encodeURIComponent(frm.elements[i].value)+"&";
        }
        else
        {
            dadosUsuario += frm.elements[i].name+"=" + encodeURIComponent(frm.elements[i].value);
        }
    }
}

// ------------ Trata a resposta do servidor ---------------
function trataResposta()
{
    if(ajax.readyState == 4)
    {
        if(ajax.status == 200)
        {
            trataDados();   // criar essa função no seu programa
        }
        else
        {
            alert("Problema na comunicação com o objeto XMLHttpRequest");
        }
    }
}

:blush:

Editado Julho 21, 2009 por Paulada
Adcionar tag's (Jonathan)

Jonathan Queiroz · Julho 20, 2009

Bem-vindo ao fórum !

Ao postar utilize as tag's para facilitar a visualização, como [code], [html], etc.

Mais informações: http://scriptbrasil.com.br/forum/index.php?showtopic=131736

Dê uma olhada também nas nossas regras

Ao invés de:

var documentoXML = ajax.ResponseXML;

Tente:

var documentoXML = ajax.responseXML;

O javascript é case sensitive. Acho que o firefox apenas aceita ajax.responseXML (não tenho certeza). Como a propriedade não existe da forma em que foi escrita, o navegador retorna undefined (até então não há erro)

O erro ocorre na outra linha porque o valor undefined não tem suporte ao método getElementsByTagName

Paulada · Julho 21, 2009

Olá amigo! Agradeço por ter editado os "codes" de meu tópico, ficou mais bonito, da próxima vez prometo que vou deixá-lo da mesma forma.

A respeito do código "response", sim, ele deverá mesmo ficar em letras minúsculas, pois fiz o teste nos 2 navegadores deste jeito e funcionou perfeitamente.

Muito obrigado mais uma vez, está resolvido! :lol:

Entrar

(Resolvido) Parâmetro de função Ajax só funciona no IE

Pergunta

Paulada

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Jonathan Queiroz

Link para o comentário

Compartilhar em outros sites

Paulada

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades