Tema: Problema con actualizacion de divs
Ver Mensaje Individual
  #7 (permalink)  
Antiguo 25/12/2010, 14:22
xziolhvinvhgl
 
Fecha de Ingreso: marzo-2010
Mensajes: 68
Antigüedad: 14 años, 1 mes
Puntos: 0
Respuesta: Problema con actualizacion de divs
ACABO DE HACER ESTE CODIGO LO HE PROBADO Y FUNCIONA A LA PERFECCION... ECHALE UN VISTAZO

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>ACTUALIZACION DE DIVS</title>

Código Javascript: 
Ver original
  1. <script type="text/javascript">
  2. function XMLHttp(){
  3.     var Object;
  4.     if(typeof XMLHttpRequest == "undefined"){
  5.         if(navigator.userAgent.indexOf("MSIE 5")>=0){
  6.             Object = new AvtiveXObject("Microsoft.XMLHTTP");    
  7.         }else{
  8.             Object = new ActiveXObject("Msxml2.XMLHTTP");   
  9.         }
  10.     }else{
  11.         Object = new XMLHttpRequest();  
  12.     }
  13.     return Object;
  14. }
  15.  
  16. //PARA EL TRABAJO EN EL PRIMER DIV//
  17.  
  18. //CODIFICAMOS LA PRIMERA LLAMADA
  19. function llamada_uno(){
  20.     var ajax = new XMLHttp();
  21.     with(ajax){
  22.         open("POST","pagina_uno.php",true);
  23.         setRequestHeader("Content-type","application/x-www-for-urlencoded");
  24.         send(null);
  25.         
  26.         onreadystatechange = function(){
  27.             if((readyState == 4) && (status == 200)){
  28.                 var resp = responseText;
  29.                 if(resp != ""){
  30.                     document.getElementById("txtOculto").value = resp; //introducimos los valores en el txtOculto
  31.                     document.getElementById("div_1").innerHTML = resp; //tambien en el div...
  32.                 }
  33.             }
  34.         }
  35.     }
  36. }
  37.  
  38. function llamada_dos(){
  39.     var ajax = new XMLHttp();
  40.     with(ajax){
  41.         open("POST","pagina_uno.php",true);
  42.         setRequestHeader("Content-type","application/x-www-for-urlencoded");
  43.         send(null);
  44.         
  45.         onreadystatechange = function(){
  46.             if((readyState == 4) && (status == 200)){
  47.                 var resp = responseText;
  48.                 if(resp != ""){
  49.                     //si la informacion traida es distinta a la que ya se habia tenido con anterioridad, entonces
  50.                     if(document.getElementById("txtOculto").value != resp){
  51.                         //actualizo lo que estaba en el campo de texto oculto para una futura comparacion, la cual se hará en 2 segundos jeje
  52.                         document.getElementById("txtOculto").value = resp;
  53.                         //actualizo el div porque la informacion es distinta..
  54.                         document.getElementById("div_1").innerHTML = resp;
  55.                     }
  56.                 }
  57.             }
  58.         }
  59.     }
  60. }
  61.  
  62.  
  63.  
  64. /*PARA EL TRABAJO EN EL SEGUNDO DIV
  65. *es practicamente el mismo código que utilizamos para el primer div
  66. *con la diferencia de que este tendrá informacion de otra página...
  67. */
  68. //CODIFICAMOS LA PRIMERA LLAMADA
  69. function llamada_uno1(){
  70.     var ajax = new XMLHttp();
  71.     with(ajax){
  72.         //fijate que la peticion va para otra pagina..
  73.         open("POST","pagina_dos.php",true);
  74.         setRequestHeader("Content-type","application/x-www-for-urlencoded");
  75.         send(null);
  76.         
  77.         onreadystatechange = function(){
  78.             if((readyState == 4) && (status == 200)){
  79.                 var resp = responseText;
  80.                 if(resp != ""){
  81.                     document.getElementById("txtOculto2").value = resp; //introducimos los valores en el txtOculto
  82.                     document.getElementById("div_2").innerHTML = resp; //tambien en el div...
  83.                 }
  84.             }
  85.         }
  86.     }
  87. }
  88.  
  89. function llamada_dos1(){
  90.     var ajax = new XMLHttp();
  91.     with(ajax){
  92.         open("POST","pagina_dos.php",true);
  93.         setRequestHeader("Content-type","application/x-www-for-urlencoded");
  94.         send(null);
  95.         
  96.         onreadystatechange = function(){
  97.             if((readyState == 4) && (status == 200)){
  98.                 var resp = responseText;
  99.                 if(resp != ""){
  100.                     //si la informacion traida es distinta a la que ya se habia tenido con anterioridad, entonces
  101.                     if(document.getElementById("txtOculto2").value != resp){
  102.                         //actualizo lo que estaba en el campo de texto oculto para una futura comparacion, la cual se hará en 2 segundos jeje
  103.                         document.getElementById("txtOculto2").value = resp;
  104.                         //actualizo el div porque la informacion es distinta..
  105.                         document.getElementById("div_2").innerHTML = resp;
  106.                     }
  107.                 }
  108.             }
  109.         }
  110.     }
  111. }
  112.  
  113.  
  114. window.onload = function(){
  115.     //HACEMOS QUE LAS FUNCIONES llamada_uno y llamada_uno1 SE EJECTUTEN PRIMERO...
  116.     llamada_uno();
  117.     llamada_uno1();
  118.     setTimeout(repite_llamadas(),5000); //DAMOS UN LAPSO DE AL MENOS 5 SEG. PARA QUE EMPIEZE A REPETIRSE CONSECUTIVAMENTE LAS FUCNIONES DOS...
  119. }
  120.  
  121. function repite_llamadas(){
  122.     //al empezar a ejecutar las funciones llamada_dos y llamada_dos1, ésta se repetirá cada 2 segundos...
  123.     setInterval("llamada_dos()",2000);
  124.     setInterval("llamada_dos1()",2000);
  125. }
  126. </script>

Código HTML: 
Ver original
  1. </head>
  2.  
  3. <body>
  4. 1<input type="text" name="txtOculto" id="txtOculto" />
  5. 2<input type="text" name="txtOculto2" id="txtOculto2" />
  6. <br />
  7. DIVS
  8. <br />
  9. 1<div id="div_1" style="border:1px solid #333; width:300px; height:200px;"></div>
  10. 2<div id="div_2" style="border:1px solid #333; width:300px; height:200px;"></div>
  11. </body>
  12. </html>

EN LAS PAGINAS .php SOLO HE COLOCADO

PARA pagina_uno.php
Código PHP: 
Ver original
  1. <?php
  2.     echo "hola xziolhvinvl";
  3. ?>

PARA pagina_dos.php
Código PHP: 
Ver original
  1. <?php
  2.     echo "hola de nuevo xziolhvinvhgl";
  3. ?>

AHORA SÍ HERMANITO ESPERO TE SIRVA JEJE ;D

SALUDOS