Cargar dos paginas diferentes en divs diferentes

[Serenity]

Hola!!, gracias por tu atención y ayuda. Estoy iniciando con ajax y no logro solucionar un problema. Necesito cargar al mismo tiempo dos diferentes páginas en divs diferentes. Cómo se hace esto??, desde ya gracias.

Saludos

[David]

Sólo tienes que crear dos objetos XMLHttpRequest() y realizar la petición correspondiente (en el evento onreadystatechange de cada objeto asignar el div en el cual mostrar la respuesta)

[Serenity]

Gracias David!!

Estoy haciendo lo que me indicas, y como comentaba estoy iniciando con ajax, así que creo no es la mejor manera de crear dos elementos onreadystatechange, pero no me carga las dos paginas.

El código es el siguiente:



function nuevoAjax()
{
/* Crea el objeto AJAX. Esta funcion es generica para cualquier utilidad de este tipo, por
lo que se puede copiar tal como esta aqui */
var xmlhttp=false;
try
{
// Creacion del objeto AJAX para navegadores no IE
xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
// Creacion del objet AJAX para IE
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(E) { xmlhttp=false; }
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') { xmlhttp=new XMLHttpRequest(); }

return xmlhttp;
}


function ajaxbuscar()
{
var valor = document.getElementById("buscar").value;
var precarga=document.getElementById("precarga");
ajax=nuevoAjax();
ajax2=nuevoAjax();
ajax.open("GET", "consulta.php?buscar="+valor+"&nocahe="+Math.rando m(), true);
ajax2.open("GET", "pedido.php", true);



ajax.onreadystatechange=function(){
if (ajax.readyState==1){
precarga.innerHTML = "Buscando...";
precarga.style.background = "url('images/loading.gif') no-repeat";
}else {

if(ajax.readyState==4){
if(ajax.status==200){
//document.getElementById("resultado").innerHTML=aja x.responseText;
resultado.innerHTML = ajax.responseText;
precarga.innerHTML = "Producto encontrado.";
precarga.style.background = "url('loaded.gif') no-repeat";
}else if(ajax.status==404){
precarga.innerHTML = "La página no existe";
}else{
precarga.innerHTML = "Error:".ajax.status;
}
}
}
}



ajax2.onreadystatechange=function(){
if (ajax2.readyState==1){
precargapedido.innerHTML = "Cargando...";
precargapedido.style.background = "url('images/loading.gif') no-repeat";
}else {

if(ajax2.readyState==4){
if(ajax2.status==200){
resultadopedido.innerHTML = ajax2.responseText;
precargapedido.innerHTML = "Pedido cargado.";
precargapedido.style.background = "url('loaded.gif') no-repeat";
}else if(ajax2.status==404){
precargapedido.innerHTML = "La página no existe";
}else{
precargapedido.innerHTML = "Error:".ajax2.status;
}
}
}
}



ajax.send(null);
ajax2.send(null);
}

[David]

Hay varias variables en tu código que no están definidas en ninguna parte, por ejemplo: precargapedido, resultado, resultadopedido. Además, la variable precarga tiene alcance sólo en esa función por lo que no funcionará dentro del evento onreadystatechange.

[Serenity]

Ok. David, lo que se refiere a los nombres precarga, precargapedido, resultado, resultadopedido son mis div dentro del código html. Y por lo que respecta a precarga tengo 2 precarga y precargapedido que están en funciones diferentes.

[David]

Aunque tengas divs con esos ids, primero debes asignar las variables para que funcione correctamente. ¿Asignas esas variables usando document.getElementById() en el contexto y con el alcance adecuados? Ya que de lo contrario no van a funcionar.

[Serenity]

Gracias David!!, si hago esa asignación con document.getElementById() , y me faltaba indicarlo a precargapedido, y me marca los siguientes errores:

- precargapedido es nulo o no es un objeto
- resultadopedido es nulo o no es un objeto

lo que pasa es que estos divs están en la primer pagina que se llama , este será el problema??

[Serenity]

Gracias David!! si era eso, le tuve que quitar puse los divs en la misma page y funciona perfectamente.