Manuales Gratis de Ayax, Enviar datos mediante POST y GET usando una sola funcion AJAX

Un ejemplo de Ajax sin XMLHttpRequest

1)Que la gente (sugestionada por las muchas herramientas creadas con apoyo en esta tecnología) se crea que Ajax sirve para todo... El otro día uno me dijo que Ajax era algo que servía para hacer drag and drop... Otro pensaba que era algo que servía para generar efectos de reflejo en imágenes... Y así podría seguir enumerando a algunos que piensan que mejora el gusto del café o que preguntan "cómo se te ocurre usar un detergente para hacer una web?".

2)Todos los websites de programación que enseñan a hacer combos relacionados, ya sea con javascript puro o con Ajax.

Y bueno, un poco para sumar yo también a este tema recurrente, y otro poco porque es un buen ejemplo de que a veces es mejor no usar Ajax sino herramientas similares, más sencillas y que obtienen el mismo resultado, les dejo este ejemplo, en el cual el evento onchange de un combo dispara una consulta al servidor, obtiene la respuesta que este le devuelve y la muestra en pantalla sin refrescar la página, es decir, de manera asíncrona, y, lo más importante, sin usar Ajax, sólo utilizando DOM javascript, algo que algunos llaman RPC javascript o Llamada a Procedimiento Remoto en javascript.

Este es el ejemplo y este es el código utilizado:

<?php
if(isset($_GET['p'])){
switch($_GET['sel']){
case '1':
$ret=array('Final del Juego','Rayuela','El Señor de loas Anillos');
break;
case '2':
$ret=array('rock','new age');
break;
case '3':
$ret=array('español','php','javascript');
break;
default:
echo 'document.getElementById("pp").innerHTML="<select name=\"dos\" id=\"dos\"></select>";';
exit;
}
$html='<select name=\"dos\" id=\"dos\">';
foreach($ret as $v)
$html.='<option value=\"'.$v.'\">'.$v.'</option>';
$html.='</select>';
echo 'document.getElementById("pp").innerHTML="'.$html.'";';
exit;
}
?>
<!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=iso-8859-1" />
<title>test</title>
<script>
function adjs(url){
oldsc=document.getElementById("old_sc");
if(oldsc)
document.getElementsByTagName('body')[0].removeChild(oldsc);
sc=document.createElement('script');
sc.id="old_sc";
sc.src=url+'&'+Math.random();
document.getElementsByTagName('body')[0].appendChild(sc);
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
<select name="uno" id="uno" onchange="adjs('?p&sel='+this.value)">
<option value="0">seleccionar</option>
<option value="1">libros</option>
<option value="2">música</option>
<option value="3">lenguaje</option>
</select>
<div id="pp"><select name="dos" id="dos">
</select></div>
</form>
</body>
</html>

Como ven, el corazón de esto es esta función:

<script>
function adjs(url){
oldsc=document.getElementById("old_sc");
if(oldsc)
document.getElementsByTagName('body')[0].removeChild(oldsc);
sc=document.createElement('script');
sc.id="old_sc";
sc.src=url+'&'+Math.random();
document.getElementsByTagName('body')[0].appendChild(sc);
}
</script>

Lo que hace la misma es incluir un nuevo elemento script en la página, cuyo atributo src es la ruta al archivo de proceso en el servidor.

Simple, sencilla, totalmente compatible con todos los navegadores modernos, y, gracias a que mediante una comprobación elimina los scripts incluídos en otras llamadas, con un consumo mínimo de recursos.

Otra ventaja frente a nuestro amigo XMLHttpRequest, aparte de su sencillez, es que puede trabajar con archivos que estén en otro dominio sin tener que apelar a ningún truco.

Enlaces:

Peruanos en el exterior, Peruanos en EE.UU, Peruanos en Argentina, Peruanos en colombia, Peruanos en Ecuador, Peruanos en Mexico, Peruanos en Venezuela, peruanos en España,Peruanos en Brazil, Peruanos en Bolivia, Peruans en Dinamarca, Peruanos en Dinamarca, Peruanos en Bulgaria, Peruanos en Bélgica, Peruanos en Chile, Peruanos en China, Peruanos en corea, Peruanos en Francia, Peruanos en Grecia, Peruanos en Holanda, Peruanos en Inglaterra, Peruanos en Japon, Peruanos en Inglaterra, Peruanos en Egipto, Peruanos en Camerun, Peruanos en Austria, Peruanos Millonarios, Chicas lindas del perú en el extranjero, Doctores del Peru en el Extranjero, Peruanos Deportistas en el Extrabjero, Fisicoculturistas Peruanos en el Extranjero, Musicos peruanos en el Extranjero, modelos Peruanos en el Exterior, Poetas Peruanos en el Exterior, Chefs peruanos en el Exterior, Como hacer un proyecto en el Exterior, Organizaciones peruanas en el Exterior, Ultimas noticias del Perú, Lo que suce den el Mundo y en el Perú, Quejas de peruanos en el Extranjero, Club de Peruanos en el Extranjero, Embajadas del Perú en el Exterior, Estas en el Exterior Reunate con mas peruanos, Peruanos por todo el Mundo, Manuales, Manuales Practicos, Videos de Peruanos, Fotos de Chicas, fotos de peruanos, Conosca a Gente del perú.