Ayuda: Primer paso en AJAX

Dago · #1 (**permalink**) 29/12/2009, 13:31

Gente, no logro dar mi primer paso en AJAX.

Tengo tres páginas.

1- Index.htm

Código:

<html>

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

<body>
<div align="center">
<table border="0" width="558" cellspacing="0" cellpadding="0" id="table1">
	<tr>
		<td>
		<div id="resultado" name="resultado">Aca resultado</div>
		</td>
		<td>&nbsp;</td>
	</tr>
	<tr>
		<td>&nbsp;</td>
		<td>&nbsp;</td>
	</tr>
	<tr>
		<td><a href="#" onClick="pasonumero(1);">1</a></td>
		<td>&nbsp;</td>
	</tr>
</table>
</div>

</body>

</html>

2- Página: ajax.js

Código:

<script>
function objetoAjax()
{  
var xmlhttp=false;  
try 
{  
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
 } 
 catch (e) 
 {  
 try {  
 xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");  
 } 
 catch (E) {  
 xmlhttp = false;  
 }  
 }  
 if (!xmlhttp && typeof XMLHttpRequest!='undefined') 
 {  
 xmlhttp = new XMLHttpRequest(); 
 }  
 return xmlhttp;
 }
///////////////////////////////////////////////////////////////

function pasonumero(id)
{

divResultado = document.getElementById('resultado');

ajax=objetoAjax();
ajax.open("POST","numero.php",true);

ajax.onreadystatechange=function() 
{  
if (ajax.readyState==4) {
divResultado.innerHTML = ajax.responseText
}
}

ajax.send("id="+id)
}


</script>

3- Página: numero.php

Código:

$id = $_POST["id"];
echo $id;

Al hacer click sobre el 1 del INDEX.HTM, me sale error. Alguno me podria dar una mano.
Gracias.

jackson666 · #2 (**permalink**) 29/12/2009, 21:08

Hola que tal Dago
Te corrijo algunas cosas:

Código Javascript:

Ver original<script type="text/javascript">
var xmlhttp=false; 
function objetoAjax(){   
 
    try{  
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); 
    }catch (e){  
         try{  
             xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");  
       
        // No hacia falta que en el bloque de captura
        // le reasignes nuevamente el valor a xmlhttp.
        // Pues si hasta aca no tiene un objeto dentro,
        // seguira siendo false. Se entiende?
        }catch (e) {
      
            //podrias hacer esto
            alert('Tu navegador no soporta AJAX');
            return false;
        }  
 }  
 
 if (!xmlhttp && typeof XMLHttpRequest!='undefined'){  
 
 xmlhttp = new XMLHttpRequest(); 
 
}  
 
 return xmlhttp;
 
 }
 
function pasonumero(id){
 
// supongo que el parametro 'id'
// es un numero que le queres pasar 
// a tu script php
 
var divResultado = document.getElementById('resultado');
 
ajax=objetoAjax();
 
//no se que tipo y cantidad de informacion
// le vas a pasar a tu php, pero te conviene
// usar el metodo GET en este caso
 
 
//fijate la forma de pasar la variable
ajax.open("GET","numero.php?num="+id);
 
ajax.onreadystatechange=function(){  
 
if (ajax.readyState==4) {
    if(ajax.status == 200){
 
        divResultado.innerHTML = ajax.responseText;
 
    }
}
}
 
//a las cabeceras no se deberia mandar nada
ajax.send(null);
}
</script>

Luego deberias llamar a la funcion pasonumero() desde un link, o mediante algun evento. Para levantar el dato en tu php, solo deberias usar algo asi como $_GET['num'];

Espero que sirva