[Php-avanzado] Cargar Select con datos de otro Select mediante Ajax

Rodrigo Fernandez shodri en gmail.com
Dom Ene 12 18:09:42 ART 2014


Gracias Leo por tan pronta y concisa respuesta !

Ahi lo logré aunque eso de appendChild firstChild.nodeValue no lo
termine de entender pero bueh, funca que es lo que importa.

Es una pavada! ;-) - no comparto la opinión...

Nos vemos !



El 11/1/14, Leonardo Tadei - Pegasus Tech Supply
<leonardot en pegasusnet.com.ar> escribió:
> Hola Rodrigo,
>
> 	a pagina1.php (que nombre poco descriptivo!) agregale más semántica,
> para que salida quede así:
>
>
> <modelos>
> 	<modelo>
> 		<id>1</id>
> 		<nombre>Gol</nombre>
> 	</modelo>
> 	<modelo>
> 		<id>2</id>
> 		<nombre>Golf</nombre>
> 	</modelo>
> 	<modelo>
> 		<id></id>
> 		<nombre>Suran</nombre>
> 	</modelo>
> </modelos>
>
> 	Si no reccibís el valor para el VALUE, no vas a tener de dónde sacarlo!
> 	De paso, el código es más simple y directo si en cada ciclo del WHILE
> generás cada entrada XML, que cargar todo en un vector para después
> tener que recorrer el vector para generar el XML: con una sola
> estructura de repetición basta.
>
> 	Después en JavaScript, leés los Modelos, pero ahora tenés adentro los
> ID y los NOMBRE de cada uno. Los cargás al OPTION así:
>
> ...
> var op=document.createElement('option');
> op.value = id;
> op.text = nombre;
> select2.appendChild(op);
> ...
>
> 	ya que un OPTION tiene como propiedad un value y un text (en vez de
> ponerle el text con un appendChild() adentro.
> 	Lo único que te queda por adaptar es la lectura del XML que ahora tiene
> una forma diferente.
>
> 	Es una pavada! ;-)
>
>
>
> El sáb, 11-01-2014 a las 18:34 -0200, Rodrigo Fernandez escribió:
>> Que tal phperos!
>> Les cuento que ando complicado queriendo cargar un select de modelos
>> de autos mediante otro de marcas de autos. Asi si uno elige Renault,
>> se cargan todos los modelos de Renault, etc.
>>
>> Modificando un ejemplo de www.ajaxya.com.ar lo logré hacer, pero mi
>> problema ahora es que no se como pasar el "value" de los modelos, me
>> queda el <option></option> pelado. Sin más les paso el código:
>>
>> pagina.php--------------------------------------------------------------------------------------------------
>>
>> <html>
>> <head>
>> <script src="funciones.js" language="JavaScript"></script>
>> </head>
>> <body>
>> <h1>Prueba de cargar un control de tipo select recuperando datos del
>> servidor
>> mediante AJAX</h1>
>> Seleccione la carrera:
>> <select id="marcas" name="marcas">
>> 	<option value="0">Seleccionar....</option>
>>
>> 	<?php
>> 	
>> 	include '../includes/conect.php';
>> 	$qry="SELECT * FROM marcas";
>> 	$res=mysqli_query($link, $qry);
>> 	while($row=mysqli_fetch_array($res)){	?>
>> 	
>> 	<option value="<?=$row['id']?>"><?=$row['marca']?></option>
>>
>> 	<?php
>> 	 }
>> 	 ?>
>> </select><span id="espera"></span><br>
>> Materias de la carrera:
>> <select id="modelos" name="modelos">
>> </select><br>
>> </body>
>> </html>
>>
>> pagina1.php-----------------------------------------------------------------------------------------------------------
>>
>> <?php
>> $car=$_REQUEST['cod'];
>> include '../includes/conect.php';
>> $materias=array();
>> $valores=array();
>> $qry="SELECT * FROM modelos WHERE id_mar=$car";
>> $res=mysqli_query($link, $qry);
>> while ($row=mysqli_fetch_array($res)){
>> 	$modelos[]=$row['modelo'];
>> }
>>
>>
>> $xml="<?xml version=\"1.0\"?>\n";
>> $xml.="<modelos>\n";
>> for($f=0;$f<count($modelos);$f++)
>> {
>>   $xml.="<modelo>".$modelos[$f]."</modelo>\n";
>> }
>> $xml.="</modelos>\n";
>> header('Content-Type: text/xml');
>> echo $xml;
>> ?>
>>
>> funciones.js---------------------------------------------------------------------------------------------------------------
>>
>> addEvent(window,'load',inicializarEventos,false);
>>
>> function inicializarEventos()
>> {
>>   var select1=document.getElementById('marcas');
>>   addEvent(select1,'change',mostrarMaterias,false);
>> }
>>
>> var conexion1;
>> function mostrarMaterias(e)
>> {
>>   var codigo=document.getElementById('marcas').value;
>>   if (codigo!=0)
>>   {
>>     conexion1=crearXMLHttpRequest();
>>     conexion1.onreadystatechange = procesarEventos;
>>     conexion1.open('GET','pagina1.php?cod='+codigo, true);
>>     conexion1.send(null);
>>   }
>>   else
>>   {
>>     var select2=document.getElementById('modelos');
>>     select2.options.length=0;
>>   }
>> }
>>
>> function procesarEventos()
>> {
>>   if(conexion1.readyState == 4)
>>   {
>>     var d=document.getElementById('espera');
>>     d.innerHTML = '';
>>     var xml = conexion1.responseXML;
>>     var pals=xml.getElementsByTagName('modelo');
>>     var select2=document.getElementById('modelos');
>>     select2.options.length=0;
>>     for(f=0;f<pals.length;f++)
>>     {
>>       var op=document.createElement('option');
>>       var texto=document.createTextNode(pals[f].firstChild.nodeValue);
>>       op.appendChild(texto);
>>       select2.appendChild(op);
>>     }
>>   }
>>   else
>>   {
>>     var d=document.getElementById('espera');
>>     d.innerHTML = '<img src="../cargando.gif">';  }
>> }
>>
>>
>> //***************************************
>> //Funciones comunes a todos los problemas
>> //***************************************
>> function addEvent(elemento,nomevento,funcion,captura)
>> {
>>   if (elemento.attachEvent)
>>   {
>>     elemento.attachEvent('on'+nomevento,funcion);
>>     return true;
>>   }
>>   else
>>     if (elemento.addEventListener)
>>     {
>>       elemento.addEventListener(nomevento,funcion,captura);
>>       return true;
>>     }
>>     else
>>       return false;
>> }
>>
>> function crearXMLHttpRequest()
>> {
>>   var xmlHttp=null;
>>   if (window.ActiveXObject)
>>     xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
>>   else
>>     if (window.XMLHttpRequest)
>>       xmlHttp = new XMLHttpRequest();
>>   return xmlHttp;
>> }
>>
>> La verdad que soy bastante queso con todo lo que tiene que ver con
>> Javascript y busque pero no encontré ninguna ayuda.
>>
>> Mi problema es como pasar también como valor del option
>> (<modelo></modelo>) el id del modelo.
>>
>> Si alguien que se da más maña con esto me da una mano más que agradecido.
>>
>> Saludos !
>> _______________________________________________
>> Lista de correo: Php-avanzado
>> Mensajes a la lista: Php-avanzado en pato2.fi.mdp.edu.ar
>> Administración Web:
>> http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado
>> Desubscripción:
>> php-avanzado-request en pato2.fi.mdp.edu.ar?subject=unsubscribe
>>
>
> --
> Leonardo Tadei
> leonardot en pegasusnet.com.ar
> Web: http://leonardo.tadei.com.ar
> Firma pública: http://www.pegasusnet.com.ar/LeonardoTadei-public.key
>
> _______________________________________________
> Lista de correo: Php-avanzado
> Mensajes a la lista: Php-avanzado en pato2.fi.mdp.edu.ar
> Administración Web:
> http://www3.fi.mdp.edu.ar/cgi-bin/mailman/listinfo/php-avanzado
> Desubscripción:
> php-avanzado-request en pato2.fi.mdp.edu.ar?subject=unsubscribe
>


Más información sobre la lista de distribución Php-avanzado