[Php-avanzado] consulta poblar select

Rodrigo Fernandez shodri en gmail.com
Jue Feb 13 09:31:09 ART 2014


Que tal Cesar,

    Hace poco tuve que resolver el mismo problema y lo consulté acá
por la lista. Te paso los mail a ver si te sirven de guia para que lo
puedas adaptar a tus necesidades. Yo encare el tema con AJAX.

>
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;
}



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 !

>>> Y Leo contestó

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! ;-) (Para él todo es una pavada :-P)

Espero que te sirva de algo.

Saludos !

El 12/2/14, Leonardo Tadei - Pegasus Tech Supply
<leonardot en pegasusnet.com.ar> escribió:
> Hola Cesar:
>
> El mié, 12-02-2014 a las 10:30 -0200, Cesar Gimenez Lascano escribió:
>> Hola. Quisiera saber si alguien tiene un link de algún tuto o podría
>> guiarme a como hacer, por ejemplo, al seleccionar en un select el
>> nombre de una empresa, otro select debajo se cargue con los productos
>> de dicha empresa. Estoy trabajando con mysql.
>
> http://entredesarrolladores.com/2418/formulario-php-javascript-actualizar-campos-cambiar-select?show=2418#q2418
> http://entredesarrolladores.com/3350/c%C3%
> B3mo-mediante-cuando-haga-click-select-categorias-aparezca?show=3350#q3350
>
> También hay respuestas a esto en el archivo de la lista del curso, pero
> no tiene buscador :-(
>
>> Leo: quería asistir a la clase de seguridad, hacerte un par de
>> consultas y recibir la devolución de la tesis, decime si es posible.
>> gracias!!!
>
> 	Es posible!
>
> 	El día del recuperatorio será el que más tiempo tengamos, pero venite
> cualquier jueves de los que quedan o más de uno si querés.
>
> 	Hace un par de semanas envié el cronograma de las actividades de
> Febrero.
>
> 	Saludos!
>
> --
> 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