funcion javascript con peticiones ajax no funciona en ie

[pithon]

Hola, hos comento un poco lo que deberia hacer el codigo, trata de una funcion que crea un archivo xml segun la opcion elejida en un select, despues creo dos funciones mas una para abrir el xml de forma asincronica y otra para mostrar los nombres en pantalla de los empreados de una empresa con un intervalo de tiempo.

Pero cada vez que llamo a la funcion que me crea el archivo xml con los nuevos datos(me lo crea con los datos de una base de datos) esta funcion a la vez llama a otra funcion para mostrar los empreados en pantalla, el codigo funciona en todos los navegadores menos en ie, muestro codigo por si alguien puede ayudarme.

aqui estan las tres funciones que uso faltaria la de la instancia http request:

Código Javascript:

<script type="text/javascript">
function recuperarEmpreados() {
        var http = objetoAjax();
        http.open('get','archivo.xml');
        http.onreadystatechange = function() {
                if(http.readyState == 4){
               if (http.status==200){
                                xml=http.responseXML;
                                if(xml.getElementsByTagName('empreado').length > 0){
                    datosEmpreados();
                                }
                         }
                }
        }
        http.send(null);
}
var pos = 0;
function datosEmpreados(){
    if(xml.getElementsByTagName('empreado').length>0){
     document.getElementById("empreados").innerHTML ='<p>'+xml.getElementsByTagName('empreado')[pos].firstChild.nodeValue+'</p>';
    pos++;
  if(pos>=(xml.getElementsByTagName('title').length)){pos = 0}
    }
}
window.onload = recuperarEmpreados;
setInterval(datosEmpreados,1000);
 
function recuperarXML(dato) {
   var peticion=objetoAjax();
   peticion.open("get","recuperar_datos.php?seccion=" + dato , true);
   peticion.onreadystatechange = function() {
      if (peticion.readyState == 4 && (peticion.status == 200 || peticion.status == 501)){
          document.getElementById('recuperar').innerHTML=peticion.responseText;
          recuperarEmpreados();
      
      }
   }
peticion.send(null);
}
</script>
 

aqui el archivo php con el select y los div donde me tiene que mostrar los datos y recuperar el xml de forma asincronica:

Código HTML:

<form>
    <select id='seccion' onchange='recuperarXML(document.getElementsById("seccion").value)'>
        <option value='administracion'>administracion</option>
        <option value='comercial'>comercial</option>
        <option value='taller'>taller</option>
    </select>
</form>
<div id="recuperar"></div>
<div id='empreados'></div>
 

El error que me da ie es que xml no esta definido esta linea:

if(xml.getElementsByTagName('empreado').length>0){

Espero que los espertos en javascript puedan ayudarme, saludos.

[zerokilled]

buenas,
lo priimero que deberías revisar es la consola de iexplorer. con algo de suerte ahí puedes determinar que esta sucediendo. y segundo, aunque te funciona en otros navegadores, opino que esta mal implementado la forma en que inicias el proceso. en particular, tienes un intérvalo que se inicia tan pronto el interprete lo lee. luego tienes un proceso que inicia cuando el navegador termine de cargar el documento. ¿qué sucederia si la carga más la petición demora más de un segundo? la función datosEmpreados no tiene la suficiente información para trabajar, lo cual es equivalente a un error y por tanto el script colapsa. el intérvalo deberias invocarlo cuando el documento xml haya cargado con éxito. por supuesto, también debes velar de detener el intérvalo cuando cambies los datos xml. de lo contrario terminarias con infinidad de intérvalos.

pd: esto no viene absolutamente al caso... no se si sea tu lengua pero se escribe "empleado" y "experto".

[pithon]

Hola zerokilled, realmente no entendi muy bien como tendria que hacerlo, si pudieras ponerme un ejemplo, decirte tambien que el intervalo de tiempo lo puse de un segundo provisionalmente para probar, en realidad lo quiero de un periodo de tiempo mas largo, sobre la consola de ie me dio el error del la variable xml no definida, o no objeto, PD perdona por las faltas de ortografia, saludos.

[zerokilled]

pues debe ser lo que comente. al momento de interpretarse la función datosEmpreados, el xml aún no ha cargado. respecto al intérvalo, simplemente ubicalo dentro del evento onreadystatechange y almacenas en una variable el identificador devuelto por setInterval. luego, cuando cambies los datos (función recuperarXML) detienes el intervalo con clearInterval y el identificador anterior.

[pithon]

Hola zerokilled, intente aplicar al codigo lo que me dijistes pero no se si hice algo mal pero los intervalos no funcionan bien, creo que no se detienen, te muestro los cambios por si quieres ayudarme.

Código Javascript:

<script type="text/javascript">
    var pos=0;
    var tiempo=null;
    var xml=null;
    function recuperarEmpreados() {
            var http = objetoAjax();
            http.open('get','archivo.xml');
            http.onreadystatechange = function() {
                    if(http.readyState == 4){
                        if (http.status==200){
                                xml=http.responseXML;
                             if(xml.getElementsByTagName('empreado').length > 0){
                                     var tiempo=setInterval(datosEmpreados,1000);
                                }
                            }
                    }
            }
            http.send(null);
    }
    function datosEmpreados(){
        if(xml.getElementsByTagName('empreado').length>0){
         document.getElementById("empreados").innerHTML ='<p>'+xml.getElementsByTagName('empreado')[pos].firstChild.nodeValue+'</p>';
        pos++;
      if(pos>=(xml.getElementsByTagName('title').length)){pos = 0}
        }
    }
 
     
    function recuperarXML(dato) {
       var peticion=objetoAjax();
       peticion.open("get","recuperar_datos.php?seccion=" + dato , true);
       peticion.onreadystatechange = function() {
          if (peticion.readyState == 4 && (peticion.status == 200 || peticion.status == 501)){
            clearInterval(tiempo);
              document.getElementById('recuperar').innerHTML=peticion.responseText;
              recuperarEmpreados();
         
          }
       }
    peticion.send(null);
    }
    </script>
 

En fin cuando cargo la pagina el intervalo funciona bien pero al cambiar el xml, ya no cumple el intervalo que deberia, saludos.

[zerokilled]

fijate que estas creando una variable local, de modo que no será visible por la otra función. me refiero a la variable tiempo (línea 13), quitale la declaración var.

[pithon]

Hola zerokilled, gracias por correjirme, estaba tan saturado que ya no vi ese error, bueno ahora funciona bien, pero el problema de ie lo sigo teniendo, alguna idea de que puede ser, saludos.

[zerokilled]

¿podrías poner un ejemplo en línea para analizar la situación? he vuelto a revisar el código y no le veo nada mal.

[pithon]

Hola zerokilled, trabajo en modo local ya que estoy en proceso de aprendizaje por eso no puedo subir la pagina a la red, pero bueno hice algunas pruebas poniendo alert() en diferentes partes del codigo, algo como esto:

Código Javascript:

<script type='text/javascript'>
var tiempo=null;
alert(tiempo);
function recuperarEmpreados() {
            var http = objetoAjax();
alert(http);
            http.open('get','archivo.xml');
            http.onreadystatechange = function() {
                    if(http.readyState == 4){
                        if (http.status==200){
                                xml=http.responseXML;
alert(xml);
                             if(xml.getElementsByTagName('empreado').length > 0){
                                     var tiempo=setInterval(datosEmpreados,1000);
alert(tiempo);
                                }
                            }
                    }
            }
            http.send(null);
    }
</script>
 

cuando cargo la pagina me salta el primer alert(tiempo), pero luego me salta directamente al otro alert(tiempo), saltandose los otros dos e incluso cuando el condicional no se cumple ya que no deberia haber datos en el xml; una vez en el codigo cargo otra vez la pagina y entonces saltan los otros tres alert(), aunque el ultimo alert(tiempo) se salta igual aunque no se cumpla el if, no se si con estos datos que te doy podras ayudarme, un saludo.

[zerokilled]

un detalle adicional que acabo ver,

Código:

    <select id='seccion' onchange='recuperarXML(document.getElementsById("seccion").value)'>

Elements esta en plural y debe ser singular. y sobre el problema de iexplorer, se me hace la idea que iexplorer esta cargando desde la cache en lugar de enviar la petición directamente al servidor. prueba agregandole un parámetro adicional a la petición pero que este siempre sea de valor variable. por ejemplo, un timestamp.

[pithon]

Hola zerokilled, tenias razon era problema de cache, le asigne un numero aleatorio y funciona bien, mil gracias nuevamente me has solucionado el problema que llevaba dias calentandome la cabeza, ya que soy novatillo, saludos.