Ver Mensaje Individual
  #1 (permalink)  
Antiguo 23/10/2010, 14:42
charliechin34
 
Fecha de Ingreso: octubre-2010
Mensajes: 1
Antigüedad: 13 años, 6 meses
Puntos: 0
Pregunta problema con selects dependientes

Hola tengo un problema con este codigo me funciona bien en IExplorer pero no funciona en firefox alguien me puede ayudar , gracias de antemano
Código PHP:
<?php
function generaPaises()
{
    include 
'conexion.php';
    
conectar();
    
$consulta=mysql_query("SELECT id, nombre FROM archivo_gral");
    
desconectar();

    
// Voy imprimiendo el primer select compuesto por los paises
    
echo "<select name='archivo' id='archivo' onChange='cargaContenido(this.id)'>";
    echo 
"<option value='0'>Elige</option>";
    while(
$registro=mysql_fetch_row($consulta))
    {
        echo 
"<option value='".$registro[0]."'>".$registro[1]."</option>";
    }
    echo 
"</select>";
}
?>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>AJAX, Ejemplos: Combos (select) dependientes, codigo fuente - ejemplo</title>
<link rel="stylesheet" type="text/css" href="select_dependientes.css">
<script type="text/javascript" src="select_dependientes.js"></script>
</head>

<body>

            <div id="demo" style="width:600px;">
                <div id="demoDer">
                    <select disabled="disabled" name="catalogo" id="catalogo">
                        <option value="0">Selecciona opci&oacute;n</option>
                    </select>
                </div>
                <div id="demoIzq"><?php generaPaises(); ?></div>
            </div>
            
</body>
</html>
Código PHP:
<?php
// Array que vincula los IDs de los selects declarados en el HTML con el nombre de la tabla donde se encuentra su contenido
$listadoSelects=array(
"archivo"=>"archivo_gral",
"catalogo"=>"catalogo_archivo_gral"
);

function 
validaSelect($selectDestino)
{
    
// Se valida que el select enviado via GET exista
    
global $listadoSelects;
    if(isset(
$listadoSelects[$selectDestino])) return true;
    else return 
false;
}

$selectDestino=$_GET["select"]; $opcionSeleccionada=$_GET["opcion"];

if(
validaSelect($selectDestino))
{
    
$tabla=$listadoSelects[$selectDestino];
    
//echo $tabla;
    
include 'conexion.php';
    
//$selectDestino=$_GET["catalogo"];
    //$opcionSeleccionada=$_GET["archivo"];
    
conectar();
    
$consulta=mysql_query("SELECT id, nombre FROM catalogo_archivo_gral WHERE id_archivo='$opcionSeleccionada'") or die(mysql_error());
    
desconectar();
    
    
// Comienzo a imprimir el select
    
echo "<select name='".$selectDestino."' id='".$selectDestino."' onChange='cargaContenido(this.id)'>";
    echo 
"<option value='0'>Elige</option>";
    while(
$registro=mysql_fetch_row($consulta))
    {
        
// Convierto los caracteres conflictivos a sus entidades HTML correspondientes para su correcta visualizacion
        
$registro[1]=htmlentities($registro[1]);
        
// Imprimo las opciones del select
        
echo "<option value='".$registro[0]."'>".$registro[1]."</option>";
    }            
    echo 
"</select>";
}
?>
Código PHP:
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","Msxml2.XMLHTTP.4.0","Msxml2.XMLH TTP.5.0","Msxml2.XMLHTTP.3.0");
    }
    catch(
e)
    {
        try
        {
            
// Creacion del objet AJAX para IE
            
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch(
E)
        {
            if (!
xmlhttp && typeof XMLHttpRequest!='undefined'xmlhttp=new XMLHttpRequest();
        }
    }
    return 
xmlhttp
}

// Declaro los selects que componen el documento HTML. Su atributo ID debe figurar aqui.
var listadoSelects=new Array();
listadoSelects[0]="archivo";
listadoSelects[1]="catalogo";

function 
buscarEnArray(array, dato)
{
    
// Retorna el indice de la posicion donde se encuentra el elemento en el array o null si no se encuentra
    
var x=0;
    while(array[
x])
    {
        if(array[
x]==dato) return x;
        
x++;
    }
    return 
null;
}

function 
cargaContenido(idSelectOrigen)
{
    
// Obtengo la posicion que ocupa el select que debe ser cargado en el array declarado mas arriba
    
var posicionSelectDestino=buscarEnArray(listadoSelectsidSelectOrigen)+1;
    
// Obtengo el select que el usuario modifico
    
var selectOrigen=document.getElementById(idSelectOrigen);
    
// Obtengo la opcion que el usuario selecciono
    
var opcionSeleccionada=selectOrigen.options[selectOrigen.selectedIndex].value;
    
// Si el usuario eligio la opcion "Elige", no voy al servidor y pongo los selects siguientes en estado "Selecciona opcion..."
    
if(opcionSeleccionada==0)
    {
        var 
x=posicionSelectDestinoselectActual=null;
        
// Busco todos los selects siguientes al que inicio el evento onChange y les cambio el estado y deshabilito
        
while(listadoSelects[x])
        {
            
selectActual=document.getElementById(listadoSelects[x]);
            
selectActual.length=0;
            
            var 
nuevaOpcion=document.createElement("option"); nuevaOpcion.value=0nuevaOpcion.innerHTML="Selecciona Opci&oacute;n...";
            
selectActual.appendChild(nuevaOpcion);    selectActual.disabled=true;
            
x++;
        }
    }
    
// Compruebo que el select modificado no sea el ultimo de la cadena
    
else if(idSelectOrigen!=listadoSelects[listadoSelects.length-1])
    {
        
// Obtengo el elemento del select que debo cargar
        
var idSelectDestino=listadoSelects[posicionSelectDestino];
        var 
selectDestino=document.getElementById(idSelectDestino);
        
// Creo el nuevo objeto AJAX y envio al servidor el ID del select a cargar y la opcion seleccionada del select origen
        
var ajax=nuevoAjax();
        
ajax.open("GET""select_dependientes_proceso.php?select="+idSelectDestino+"&opcion="+opcionSeleccionadatrue);
        
ajax.onreadystatechange=function() 
        { 
            if (
ajax.readyState==1)
            {
                
// Mientras carga elimino la opcion "Selecciona Opcion..." y pongo una que dice "Cargando..."
                
selectDestino.length=0;
                var 
nuevaOpcion=document.createElement("option"); nuevaOpcion.value=0nuevaOpcion.innerHTML="Cargando...";
                
selectDestino.appendChild(nuevaOpcion); selectDestino.disabled=true;    
            }
            if (
ajax.readyState==4)
            {
                
selectDestino.parentNode.innerHTML=ajax.responseText;
            } 
        }
        
ajax.send(null);
    }


y aqui dejo la base
Código PHP:
CREATE TABLE `archivo_gral` (
  `
idchar(3COLLATE utf8_spanish2_ci NOT NULL,
  `
nombrevarchar(45COLLATE utf8_spanish2_ci NOT NULL,
  
PRIMARY KEY (`id`)
ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_spanish2_ci;

--
-- 
Dumping data for table `archivo_gral`
--

/*!40000 ALTER TABLE `archivo_gral` DISABLE KEYS */;
INSERT INTO `archivo_gral` (`id`,`nombre`) VALUES 
 
('APA','ASPECTOS DE ADMINISTRACION'),
 (
'APC','CONTROL EXTERNO'),
 (
'APF','ASPECTOS FINANCIEROS'),
 (
'APL','LEGISLACION DE LA ENTIDAD'),
 (
'O','OTROS'); 
Código PHP:
DROP TABLE IF EXISTS `catalogo_archivo_gral`;
CREATE TABLE `catalogo_archivo_gral` (
  `
idchar(4COLLATE utf8_spanish2_ci NOT NULL,
  `
nombrevarchar(100COLLATE utf8_spanish2_ci NOT NULL,
  `
id_archivochar(3COLLATE utf8_spanish2_ci NOT NULL,
  
PRIMARY KEY (`id`),
  
KEY `FK_catalogo_archivo_gral_1` (`id_archivo`),
  
CONSTRAINT `FK_catalogo_archivo_gral_1FOREIGN KEY (`id_archivo`) REFERENCES `archivo_gral` (`id`) ON DELETE CASCADE ON UPDATE CASCADE
ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_spanish2_ci;

--
-- 
Dumping data for table `catalogo_archivo_gral`
--

/*!40000 ALTER TABLE `catalogo_archivo_gral` DISABLE KEYS */;
INSERT INTO `catalogo_archivo_gral` (`id`,`nombre`,`id_archivo`) VALUES 
 
('APA1','Estructura Organizativa','APA'),
 (
'APA2','Manuales de Organización y Puestos','APA'),
 (
'APA3','Manuales de Procedimientos','APA'),
 (
'APA4','Planes Estratégico y Operativo','APA'),
 (
'APA5','Diagramas de Flujo de las Principales Actividades','APA'),
 (
'APC1','Plan Estratégico de Auditoría Interna','APC'),
 (
'APC2','Plan Anual Operativo de Auditoría Interna','APC'),
 (
'APC3','Informes de Auditoría Interna','APC'),
 (
'APC4','Informes de Auditoría Externa','APC'),
 (
'APC5','Denuncias Ciudadanas','APC'),
 (
'APF1','Manual del Sistema Contable','APF'),
 (
'APF2','Catálogo de Cuentas','APF'),
 (
'APF3','Políticas Contables','APF'),
 (
'APF4','Estados Financieros','APF'),
 (
'APL1','Ley de Creación y sus Reformas','APL'),
 (
'APL2','Reglamentos de Ley','APL'),
 (
'APL3','Reglamentos Internos','APL'),
 (
'APL4','Instructivos','APL'),
 (
'APL5','Presupuesto Autorizado','APL'),
 (
'APL6','Memoria de Labores Institucional','APL'),
 (
'APL7','Acuerdos y Resoluciones de Alta Dirección','APL'),
 (
'APL8','Contratos, Convenios de Préstamo y Donaciones','APL');
/*!40000 ALTER TABLE `catalogo_archivo_gral` ENABLE KEYS */