Problema com AJAX + PHP

Programação Java
#1

Olá, meus caros. Programei este início de área administrativa. Porém, quando clico em algum item do menu, não carrega o conteúdo correspondente na DIV “opcao_adm”.

Eis o código:

<?php

  // conectar ao banco

?>

<!DOCTYPE html>
<html>

<head>
  <title>&Aacute;rea Administrativa</title>
  
  <link rel="stylesheet" type="text/css" href="css/estilo.css" />
  
  <script type="text/javascript">

      function carregarOpcaoDoMenu(int opcao) {
    
      var xmlhttp;
	  
      try { // Firefox, Opera 8.0+, Safari
        xmlhttp = new XMLHttpRequest();
      } catch (e) { // Internet Explorer
        try {
          xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
          try { // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
          } catch (e) {
            alert("Seu browser não suporta AJAX!");
            return false;
          }
        }
      }
	
	
	  xmlhttp.onreadystatechange = function () {
	  
	    if ( xmlhttp.readyState == 4 && xmlhttp.status == 200 ) {
		  document.getElementById['opcao_adm'].innerHTML = xmlhttp.responseText;
		}
		
	  }
	  
	  xmlhttp.open("GET", "recupera_opcao.php?opcao=" + opcao,true);
      xmlhttp.send();	  
	  
	}
	
	
  </script>

</head>

<body>

  <div>
  &Aacute;rea Administrativa
  
    <div id="opcao_adm" class="menu">
	  <ul>
	    <li><a href="#" onClick="javascript:carregarOpcaoDoMenu('1'); return false;">Not&iacute;cias</a></li>
		<li><a href="#" onclick="javascript:carregarOpcaoDoMenu('2'); return false;">Infraestrutura</a></li>
		<li><a href="#" onclick="javascript:carregarOpcaoDoMenu('3'); return false;">Agradecimentos</a></li>
	  </ul>
	</div>
  
    <div id="opcao_adm" class="conteudo"></div>
  
  </div>
  
</body>

</html>

E mais este para o recupera_opcao.php ( este está funcionando perfeitamente ) :

<?php

  if ($_GET['opcao'] == '1') echo "Opcao 1 : Menu NOTICIAS";
  else if ($_GET['opcao'] == '2') echo "Opcao 2 : Menu INFRAESTRUTURA";
  else if ($_GET['opcao'] == '3') echo "Opcao 3 : Menu AGRADECIMENTOS";

?>

Apenas por curiosidade, o CSS em questão:

.menu {
  float:left;
 }
 
 .menu ul li{
   display:inline;
   border:1px solid black;
   background-color: #eee;
   padding: 2px;
   margin: 5px;
 }
 
 .menu ul li a:link{
   text-decoration:none;
 }
 
 .conteudo {
   float:right;
 }

Desde já agradeço!

#2

O ideal é utilizar um debug para ver até onde o js é executado.
Ou ir enchendo de alert(‘passei aqui’) para ver qual o último.

#3

cade o Java Avançado ?

#4

[quote=drsmachado]O ideal é utilizar um debug para ver até onde o js é executado.
Ou ir enchendo de alert(‘passei aqui’) para ver qual o último.[/quote]

Pois eh… Fiz isso e ele nem entrou na função!

E agora?

#5

Pode até não estar 100% relacionado , João, mas o desespero é grande e eu sei que o pessoal é fera ! :slight_smile:

#6

Existem outras sessões do fórum para perguntas relacionadas a outras tecnologias que tem espaço aqui.

Para resolver seu problema, use o Plugin do Firefox Firebug¹, nele você consegue ver o que foi enviado no seu GET, e o que seu servidor respondeu, e qual o erro disparado pelo JavaScript.

Normalmente isso facilita bastante o debug de aplicações Ajax.

No seu caso esse getElementById é uma função e você está acessando como se fosse um array, da uma olhada aqui: http://www.w3schools.com/jsref/met_doc_getelementbyid.asp

[1] https://addons.mozilla.org/pt-br/firefox/addon/firebug/

#7

Cara uma dica …

tenta usar Jquery para criar os ajax facilita um monte e deixa o código preparado para expansão…

segue o link para estudo caso deseje …
http://api.jquery.com/jQuery.ajax/

#8

Na verdade eu já resolvi via Ajax mesmo … Era problema de falta de chaves …

Também já comecei a estudar jQuery

Obrigado mesmo assim

#9

[quote=cheio_de_duvidas]Na verdade eu já resolvi via Ajax mesmo … Era problema de falta de chaves …

Também já comecei a estudar jQuery

Obrigado mesmo assim[/quote]
Eu acredito que para começar a usar jQuery ou mesmo prototype, deve-se saber o suficiente de javascript, para evitar problemas posteriores.
Caso contrário, quando ocorrerem problemas ou quando usar um js lib não for possível, você terá uma série de dificuldades.

#10