No tengo ni idea de Ajax

[thi]

Hola a todos,

el titulo es por que necesito ayuda para poder hacer consultas en bases de datos y que me muestre el resultado en formato tabla en pantalla sin que se refresque, y creo que la unica forma es con Ajax y la verdad no tengo ni idea de como hacerlo.

Un saludo.

[vrenzo]

Aqui va un ejemplo....

busqueda.html

<script language="javascript" src="ajax.js"></script>
<script language="javascript">
oAjax=getXMLHTTPRequest();

function efectuar_busqueda(){

myRand=parseInt(Math.random()*999999999999999);

codigo=document.form1.codigoid.value;
archivo='busca_alumno.php?rand='+myRand+'&codigo=' +codigo;
oAjax.open('GET',archivo,true);
oAjax.onreadystatechange=ver_respuesta;
oAjax.send(null);

}
function ver_respuesta(){
if(oAjax.readyState==4){
if(oAjax.status==200){
document.form1.resultado.value=oAjax.responseText;
}
}else{
document.form1.resultado.value="Procesando..."
}
}


</script>

<form name="form1" method="post" action="">
<table width="500" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>CODIGO DEL ALUMNO
<input type="text" name="codigoid" id="codigoid">
<!--<input type="botton" value="Enviar" onClick="efectuar_busqueda()">
-->

<input type="button" value="Buscar" onClick="efectuar_busqueda()">
</tr>
<tr>
<td><textarea name="textfield" cols="60" rows="10" id="resultado" row="10"></textarea></td>
</tr>
</table>
</form>

ajax.js

function getXMLHTTPRequest(){
var req;
try{
req=new XMLHttpRequest();
}catch(err1){
try{
req=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(err2){
try{
req=new ActiveXObject("Microsoft.XMLHTTP");
}catch(err3){
req=false;
}

}
}
return req;


}

buscar_alumno.php

<?
$codigo=$_GET[codigo];
$cn= mysql_connect ('localhost','root','');

mysql_select_db("dbdemo");

$sql= "select * from alumno where idalumno=$codigo" ;
$rs=mysql_query($sql);
$n=mysql_num_rows($rs);

if($n){
echo "Id_alumno : ".mysql_result($rs,0,"idalumno").chr(13)."Apellido s : ".mysql_result($rs,0,"apellidos").chr(13). "Nombres : ".mysql_result($rs,0,"nombre").chr(13)."Direcc ion : ".mysql_result($rs,0,"direccion");
}else{
echo "Id_alumno : No resgistrado".chr(13)."Apellidos : No resgistrado".chr(13)."Nombre : No resgistrado".chr(13)."Direccion : No resgistrado";
}

?>

Y por supuesto la data...

CREATE TABLE `alumno` (
`idalumno` int(11) NOT NULL auto_increment,
`apellidos` varchar(50) NOT NULL,
`nombre` varchar(50) NOT NULL,
`direccion` varchar(50) NOT NULL,
PRIMARY KEY (`idalumno`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=5 ;


INSERT INTO `alumno` VALUES (1, 'gonzales', 'luis', 'av jose galvez 360');
INSERT INTO `alumno` VALUES (2, 'osorio', 'manuel', 'laslilasp23');
INSERT INTO `alumno` VALUES (3, 'carranza', 'jose', 'los pinos990');
INSERT INTO `alumno` VALUES (4, 'martinez', 'alfredo', 'av canada 227');

Espero que esto te de una idea...

Saludos....

[thi]

Gracias por tu respuesta vrenzo,

pero me temo que tengo molestarte un poco mas, porque he cogido tu codigo y lo he modificado y me da el siguiente error:

<br /><b>Parse error</b>: syntax error, unexpected T_ENCAPSED_AND_WHITESPACE, expecting T_STRING or T_VARIABLE or T_NUM_STRING in <b>/var/www/busca.php</b> on line <b>12</b><br />

para situarte te pongo como he dejado los archivos que me pusiste:

archivo html:

<script language="javascript" src="/js/buscar_ajax.js"></script>
<script language="javascript">
oAjax=getXMLHTTPRequest();

function efectuar_busqueda(){

myRand=parseInt(Math.random()*999999999999999);

codigo=document.form1.codigoid.value;
archivo='busca.php?rand='+myRand+'&codigo=' +codigo;
oAjax.open('GET',archivo,true);
oAjax.onreadystatechange=ver_respuesta;
oAjax.send(null);

}
function ver_respuesta(){
if(oAjax.readyState==4){
if(oAjax.status==200){
document.form1.resultado.value=oAjax.responseText;
}
}else{
document.form1.resultado.value="Procesando..."
}
}
</script>

<form name="form1" method="post" action="">
<table width="500" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>CODIGO
<input type="text" name="codigo" id="codigoid">
<!--<input type="botton" value="Enviar" onClick="efectuar_busqueda()">
-->

<input type="button" value="Buscar" onClick="efectuar_busqueda()">
</tr>
<tr>
<td><input type="text" name="textfield" id="resultado" size="200"></td></tr></table>

archivo busca.php:

<?
//datos de la conexion a la base de datos
require('conexion.php');


$codigo=$_GET[codigo];

$query = "SELECT * FROM avyom.ciudades WHERE

ciudad=$codigo";
$result = mysql_query($query);
while ($row =

mysql_fetch_array($result,MYSQL_ASSOC))
{
echo "El pais de la ciudad seleccionada es:

'.$row['pais'];
}
?>

el archivo js sólo le he cambiado el nombre por buscar_ajax.js

y la tabla sólo tiene 3 campos: id, pais, ciudad

Un saludo.

[vrenzo]

Hola...

Hasta donde pude notar en busca.php

Código PHP:

  while ($row = 
 
mysql_fetch_array($result,MYSQL_ASSOC)) 
{ 
echo "El pais de la ciudad seleccionada es:'.$row['pais'];  
   

te falta cerrar la comilla en "El pais...

Osea:

Código PHP:

  while ($row = 
 
mysql_fetch_array($result,MYSQL_ASSOC)) 
{ 
echo "El pais de la ciudad seleccionada es: ".$row['pais'];  
   

Dime si con eso corre...

Saludos.

[thi]

Gracias vrenzo,

ya funciona con el archivo php de la siguiente forma:

<?
//datos de la conexion a la base de datos
require('conexion.php');


$codigo=$_GET[codigo];

$query = "SELECT * FROM ciudades WHERE ciudad='".$codigo."'";
$result = mysql_query($query);
while ($row = mysql_fetch_array($result,MYSQL_ASSOC))
{
echo "El pais de la ciudad seleccionada es: ".$row['pais'];
}
?>

la verdad lo hizo todo tan deprisa que no me fije bien en el codigo y tambien tuve que modificar el "SELECT".

Un último favor, me podias explicar un poco que hace el archivo ajax.js

Un saludo.

[cesarpunk]

el archivo ajax crea un objeto que se encarga de gestionar la peticion y procesamientos de datos en el servidor

[chalchis]

un buen tutorial de entrada

http://www.librosweb.es/ajax/