Como fazer 2 requests diferentes em AJAX

25 de abril de 2013 4 respostas

blastboot 25 de abril de 2013

Tenho este código em AJAX na minha página para fazer um request &dadosagua que vai retornar o valor da altura da água (um valor entre 0 e 465). Mas tenho também que enviar outro request, algo do género &voltagembateria para receber o valor da voltagem da bateria. Gostaria que me pudessem encaminhar para uma forma de fazer isto, de uma maneira simples, poruqe o meu conhecimento de AJAX não é muito avançado. O código que tenho é o seguinte:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE8">

<title>SITE PARA NIVEL AGUA</title>

<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function dadosAlturaAgua(){
	nocache = "&nocache=" + Math.random() * 1000000;
	var request = null;  // The variable that makes Ajax possible!
	if( window.XMLHttpRequest )
	{
		// Opera 8.0+, Firefox, Safari
        request = new XMLHttpRequest();
    } 
    else if( window.ActiveXObject )
    {
        try
        {
			//Internet Explorer Browsers
            request = new XMLHTTP("Microsoft.XMLHTTP");
        }
        catch(e)
        {
            try
            {
                request = new XMLHTTP("Msxml2.XMLHTTP");
            }
            catch(e)
            {
                request = false;
            }
        }
    }

    if( request === false || request === null )
    {
        window.alert("AJAX nao suportado! Impossivel visualisar dados. Considere actualizar o browser.");
    }

// Create a function that will receive data sent from the server
	request.onreadystatechange = function(){
		if(request.readyState == 4){
			if(request.status == 200){
				if(request.responseText != null){
					
document.getElementById("inner").style.height = request.responseText;

				}
			}
		}
	}
	request.open("GET", "&dadosagua" + nocache, true);
	request.send(null);
	setTimeout('dadosAlturaAgua()', 5000);

}

//-->
</script>

</head>
<body onload="dadosAlturaAgua()">
</body>

Desde já agradeço a vossa ajuda.

4 Respostas

drsmachado 25 de abr. de 2013

Eu primeiro separaria esta função em algumas diferentes.

var request = null;  // The variable that makes Ajax possible!  
function createRequest(){
    if( window.XMLHttpRequest )  
    {  
        // Opera 8.0+, Firefox, Safari  
        request = new XMLHttpRequest();  
    }   
    else if( window.ActiveXObject )  
    {  
        try  
        {  
            //Internet Explorer Browsers  
            request = new XMLHTTP("Microsoft.XMLHTTP");  
        }  
        catch(e)  
        {  
            try  
            {  
                request = new XMLHTTP("Msxml2.XMLHTTP");  
            }  
            catch(e)  
            {  
                request = false;  
            }  
        }  
    }  
  
    if( request === false || request === null )  
    {  
        window.alert("AJAX nao suportado! Impossivel visualisar dados. Considere actualizar o browser.");  
    }  
}

function callAjax(div, location){
        createRequest();
	request.onreadystatechange = function(){  
        if(request.readyState == 4){  
            if(request.status == 200){  
                if(request.responseText != null){  
                      
document.getElementById(div).style.height = request.responseText;  
  
                }  
            }  
        }  
    }  
    request.open("GET", location + nocache, true);  
    request.send(null);  
    setTimeout('dadosAlturaAgua()', 5000);  
}

Com estas alterações, você só precisa direcionar o que quer e quando quer.
Por exemplo, para chamar o &dadosagua e colocar a alteração na div inner, faça:

<a href="#" onclick="callAjax('inner', '&dadosagura');">Dados Agua</a>

Já para &voltagembateria, usando um outro div, com nome batdiv

<a href="#" onclick="callAjax('batdiv', '&voltagembateria');">Voltagem Bateria</a>

blastboot 25 de abr. de 2013

Obrigado pela resposta! O onclick quer dizer que tenho que clicar em algo para fazer os requests não é? se sim o que eu pretendia era que fosse automático, de x em x tempo, os 2 requests (&dadosagua e &voltagembateria). Alguma sugestão?

drsmachado 25 de abr. de 2013

O javascript possui algumas ferramentas que permitem, a cada período de tempo, realizar alguma coisa.
Veja aqui alguns exemplos.

blastboot 26 de abr. de 2013

obrigado pela ajuda!

Criado 25 de abril de 2013

Ultima resposta 26 de abr. de 2013

Respostas 4

Participantes 2

4 Respostas

Topicos relacionados