Modo listagem | Modo Linear

Ribeiro · (Esta mensagem foi modificada pela última vez a: 24-07-2009 12:09 por Ribeiro.)

Boas pessoal!!

Estou com problemas em resolver uma situação em Ajax, se me pudessem dar umas dicas, agradecia.
O problema é o seguinte: estou a desenvolver um site e quero implementa-lo com Ajax, então o que fiz foi criar um “div id=main” na minha pagina html que se divide em “div id=left”, que contem um menu de links e “div id=right”.
A ideia passa por carregar, por exemplo num link e através de Ajax fazer com que a informação apareça no lado direito(e funciona). O senão é que apenas funciona se substituir os links por botões.
Alguém tem ideia como fazê-lo com links??

O código do ficheiro de Jscript(ajax.js):

Código:

var xmlHttpRequest = null;

 //Função que cria o Objecto XmlHttpRequest

 function criarObjectoXmlHttpRequest()

 {

    if (window.XMLHttpRequest)

    {

      xmlHttpRequest = new XMLHttpRequest()

    }

    else if (window.ActiveXObject) 

    {

      xmlHttpRequest = new ActiveXObject("Microsft.XMLHTTP")

    }

      if (xmlHttpRequest == null)

        alert("Erro ao criar o objecto XMLHttpRequest!");

 }

 //Efectua o pedido ao servidor da informação contida no ficheiro nosso_clube.html

 function efectuarPedido()

 {

    criarObjectoXmlHttpRequest();

    var url="nosso_clube.html";

    xmlHttpRequest.open("GET", url, true);

    xmlHttpRequest.onreadystatechange = actualizarPagina;

    xmlHttpRequest.send(null);

 }

 //Actualiza o pagina html com a informação proveniente do servidor

 function actualizarPagina()

 {

  if (xmlHttpRequest.readyState == 4)

  {

    var novaPagina = xmlHttpRequest.responseText;

    document.getElementById("right").innerHTML = novaPagina;

  }

 }

Código do ficheiro de html:

Código:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head> 

  <script type="text/javascript" src="ajax.js"></script>

  </head>

      <body>

          <div id="content">

           <div id="back">

              <div id="header">

                <img src="simbolo.PNG"/>

              </div>

           <div id="main">

                 <div id="left">

<!-- <input type="button" value="Pedido" onClick="efectuarPedido()"/>--> 

<a href="" onClick="efectuarPedido()">O nosso clube</a>

<a href="" onClick="efectuarPedido()">Equipa</a>

<!-- Nesta parte tenho mais links, mas são todos iguais aos de cima -->

                 </div>

                 <div id="right"> </div>

          </div>

          </div>

          </div>    

  </body>

</html>

Neste ultimo ficheiro decidi apagar algumas linhas que não são importantes para o problema em questão, de modo a simplificar ao máximo para quem esta a ver.

O ficheiro "nosso_clube.html", apenas contem um paragrafo (fiz o paragrafo só para testar). Outra situação em que irei "esbarrar" será na função "efectuarPedido", já que neste momento apenas esta feita para pedir ao servidor um url, mas a solução final terá de fazer pedidos a todos os html´s que estão no servidor consoante o link clicado. Mas irei ver isso mais lá para a frente.

Cumprimentos. Smile