Ver Mensaje Individual
  #4 (permalink)  
Antiguo 11/03/2012, 12:02
elrey123
 
Fecha de Ingreso: febrero-2009
Mensajes: 61
Antigüedad: 15 años, 2 meses
Puntos: 1
Respuesta: no funciona los archivos de ajax

extraproceso.php

Código PHP:
Ver original
  1. <?php
  2. // Array que vincula los IDs de los selects declarados en el HTML con el nombre de la tabla donde se encuentra su contenido
  3. $listadoSelects=array(
  4. "select4"=>"select_4",
  5. "select5"=>"select_5",
  6. "select6"=>"select_6"
  7. );
  8.  
  9. function validasel($selectDestino)
  10. {
  11.     // Se valida que el select enviado via GET exista
  12.     global $listadoSelects;
  13.     if(isset($listadoSelects[$selectDestino])) return true;
  14.     else return false;
  15. }
  16.  
  17. function validaop($opcionSeleccionada)
  18. {
  19.     // Se valida que la opcion seleccionada por el usuario en el select tenga un valor numerico
  20.     if(is_numeric($opcionSeleccionada)) return true;
  21.     else return false;
  22. }
  23.  
  24. $selectDestino=$_GET["select"]; $opcionSeleccionada=$_GET["opcion"];
  25.  
  26. if(validasel($selectDestino) && validaop($opcionSeleccionada))
  27. {
  28.     $tabla=$listadoSelects[$selectDestino];
  29.     include 'conexion.php';
  30.     conectar();
  31.     $consulta2=mysql_query("SELECT id, opcion FROM $tabla WHERE relacion='$opcionSeleccionada'") or die(mysql_error());
  32.     desconectar();
  33.    
  34.     // Comienzo a imprimir el select
  35.     echo "<select name='".$selectDestino."' id='".$selectDestino."' onChange='cargarcontenido(this.id)'>";
  36.     echo "<option value='0'>Elige</option>";
  37.     while($registro2=mysql_fetch_row($consulta2))
  38.     {
  39.         // Convierto los caracteres conflictivos a sus entidades HTML correspondientes para su correcta visualizacion
  40.         $registro2[1]=htmlentities($registro2[1]);
  41.         // Imprimo las opciones del select
  42.         echo "<option value='".$registro2[0]."'>".$registro2[1]."</option>";
  43.     }          
  44.     echo "</select>";
  45. }
  46. ?>

extra.js

Código Javascript:
Ver original
  1. function nuevoAjax()
  2. {
  3.     /* Crea el objeto AJAX. Esta funcion es generica para cualquier utilidad de este tipo, por
  4.     lo que se puede copiar tal como esta aqui */
  5.     var xmlhttp=false;
  6.     try
  7.     {
  8.         // Creacion del objeto AJAX para navegadores no IE
  9.         xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");
  10.     }
  11.     catch(e)
  12.     {
  13.         try
  14.         {
  15.             // Creacion del objet AJAX para IE
  16.             xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  17.         }
  18.         catch(E)
  19.         {
  20.             if (!xmlhttp && typeof XMLHttpRequest!='undefined') xmlhttp=new XMLHttpRequest();
  21.         }
  22.     }
  23.     return xmlhttp;
  24. }
  25.  
  26. // Declaro los selects que componen el documento HTML. Su atributo ID debe figurar aqui.
  27. var listadoSelects=new Array();
  28. listadoSelects[0]="select4";
  29. listadoSelects[1]="select5";
  30. listadoSelects[2]="select6";
  31.  
  32. function buscarEnArray(array, dato)
  33. {
  34.     // Retorna el indice de la posicion donde se encuentra el elemento en el array o null si no se encuentra
  35.     var x=0;
  36.     while(array[x])
  37.     {
  38.         if(array[x]==dato) return x;
  39.         x++;
  40.     }
  41.     return null;
  42. }
  43.  
  44. function cargarcontenido(idSelectOrigen)
  45. {
  46.     // Obtengo la posicion que ocupa el select que debe ser cargado en el array declarado mas arriba
  47.     var posicionSelectDestino=buscarEnArray(listadoSelects, idSelectOrigen)+1;
  48.     // Obtengo el select que el usuario modifico
  49.     var selectOrigen=document.getElementById(idSelectOrigen);
  50.     // Obtengo la opcion que el usuario selecciono
  51.     var opcionSeleccionada=selectOrigen.options[selectOrigen.selectedIndex].value;
  52.     // Si el usuario eligio la opcion "Elige", no voy al servidor y pongo los selects siguientes en estado "Selecciona opcion..."
  53.     if(opcionSeleccionada==0)
  54.     {
  55.         var x=posicionSelectDestino, selectActual=null;
  56.         // Busco todos los selects siguientes al que inicio el evento onChange y les cambio el estado y deshabilito
  57.         while(listadoSelects[x])
  58.         {
  59.             selectActual=document.getElementById(listadoSelects[x]);
  60.             selectActual.length=0;
  61.            
  62.             var nuevaOpcion=document.createElement("option"); nuevaOpcion.value=0; nuevaOpcion.innerHTML="Selecciona Opci&oacute;n...";
  63.             selectActual.appendChild(nuevaOpcion);  selectActual.disabled=true;
  64.             x++;
  65.         }
  66.     }
  67.     // Compruebo que el select modificado no sea el ultimo de la cadena
  68.     else if(idSelectOrigen!=listadoSelects[listadoSelects.length-1])
  69.     {
  70.         // Obtengo el elemento del select que debo cargar
  71.         var idSelectDestino=listadoSelects[posicionSelectDestino];
  72.         var selectDestino=document.getElementById(idSelectDestino);
  73.         // Creo el nuevo objeto AJAX y envio al servidor el ID del select a cargar y la opcion seleccionada del select origen
  74.         var ajax=nuevoAjax();
  75.         ajax.open("GET", "extraproceso.php?select="+idSelectDestino+"&opcion="+opcionSeleccionada, true);
  76.         ajax.onreadystatechange=function()
  77.         {
  78.             if (ajax.readyState==1)
  79.             {
  80.                 // Mientras carga elimino la opcion "Selecciona Opcion..." y pongo una que dice "Cargando..."
  81.                 selectDestino.length=0;
  82.                 var nuevaOpcion=document.createElement("option"); nuevaOpcion.value=0; nuevaOpcion.innerHTML="Cargando...";
  83.                 selectDestino.appendChild(nuevaOpcion); selectDestino.disabled=true;   
  84.             }
  85.             if (ajax.readyState==4)
  86.             {
  87.                 selectDestino.parentNode.innerHTML=ajax.responseText;
  88.             }
  89.         }
  90.         ajax.send(null);
  91.     }
  92. }