Foros del Web » Programando para Internet » Javascript » Frameworks JS »

problema con selects dependientes

Estas en el tema de problema con selects dependientes en el foro de Frameworks JS en Foros del Web. Hola tengo un problema con este codigo me funciona bien en IExplorer pero no funciona en firefox alguien me puede ayudar , gracias de antemano ...
  #1 (permalink)  
Antiguo 23/10/2010, 14:42
 
Fecha de Ingreso: octubre-2010
Mensajes: 1
Antigüedad: 12 años, 3 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 */

Etiquetas: ajax, dependientes, selects
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 16:42.