PHP - 3 Select Dependientes

   
Vista:

3 Select Dependientes

Publicado por Santos (13 intervenciones) el 14/03/2008 12:47:53
Espero alguien me pueda ayudar.

Yo quiero poner un primer select que se carge con una consulta a una tabla de una base de datos, hasta aquí todo bien.

Despues quiero poner un segundo select que se carga con otra consulta a la misma tabla de la base de datos que el primer select pero en función de la elección del primer select, os pongo un ejemplo para que lo entendais.

Mi primer select carga las marcas de los coches de una base de datos, esto lo hago con distinct en la query. El segundo select debería cargar los modelos de la marca elegida en el primer select, y aquí es donde me da error, y el tercer select debería cargar los años de ese modelo, pero hasta aquí no he llegado.

Os pongo la parte de codigo que tengo para que me echeis una mano.

Gracias anticipadas.

<?php
//conexión a mysql
@ $db=mysql_connect ("localhost", "root", "");
mysql_select_db("basedatos");
//seleccionamos las opciones del select principal
$sql = "SELECT DISTINCT MARCA FROM piezas";
$result = mysql_query($sql);
$num_results = mysql_num_rows ($result);
$lineas = $num_results;
$firmas = $lineas;
$Fin = $lineas;
$Inic = 1;
?>

<FORM name="form1" method="POST">

<!--Combo principal-->
<select name="marca" onChange="redirect(this.options.selectedIndex)" style='width:160'>
<option selected value=0>MARCA</option>
<?php
//mostramos todos nuestros artículos, viendo si han sido agregados o no a nuestro carro de compra
for ($i=$Inic;$i<=$Fin;$i++) {
$row=mysql_fetch_array($result);
?>

<option value="<?php echo $row ['MARCA']; ?>"><?php echo $row ['MARCA']; ?></option>

<?php
}
?>
</select>

<!--Combo dinámico-->
<select name="modelo" style='width:160'>
<option selected value=0>MODELO</option>
</select>

</FORM>

<?
echo "<script><!--";
echo "var groups=".$num;
echo "var group=new Array(groups)";

//Crea tantos arrays como valores hay en el combo principal
echo "for (i=0; i<groups; i++) group=new Array()";

//Opciones cuando no se ha hecho ninguna selección en el combo principal-->
echo "group[0][0]=new Option('MODELO','0');";

for($i=0;$i<$num;$i++) {

$sql = "SELECT DISTINCT MODELO FROM piezas WHERE MARCA =".$_POST['marca'];
$res = mysql_query($sql);
//Obtenemos el número de modelos para esa marca
$num2 = mysql_num_rows($res);

for($j=0;$j<$num2;$j++) {

$id_modelo = mysql_result($res,$j,0);
$modelo = mysql_result($res,$j,1);

//Opciones para la opción $i del combo principal
echo "group[$num][$j]=new Option('$modelo','$id_modelo')";

}
}

?>

var temp=document.form1.modelo

function redirect(x){
for (m=temp.options.length-1;m>0;m--)
temp.options[m]=null
for (i=0;i<group[x].length;i++){
temp.options=new Option(group[x].text,group[x].value)
}
temp.options[0].selected=true
}
//-->
</script>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

RE:3 Select Dependientes

Publicado por Richard Bravo (52 intervenciones) el 14/03/2008 14:05:51
Hola!!!

Mira para hacer esto lo que necesitas es ajax...... y leyendo tu codigo encontre un pequeño error....... en el Onchange del primer select no tienes que usar el SelectedIndex.... lo que realmente necesitas el el value de esa opcion me entiendes.. porque el selected index no va a ser igual al valor que tu sacaste de la base de datos.... asi te ahorrarias un paso en tu script.....

La primera parte la estas haciendo bien ya que el primer combo se debe cargar al cargar el sitio... pero un consejo seria cargar el Value

ESTO ES PARA OBTENER DIRECTAMENTE EL VALUE DE LA OPCION SELECCIONADA....

this.options[this.selectedIndex].value

Una vez que tengas el value... tenemos que usar una funcion ajax para que puedes volver a llamar a la base de datos y puedas volver a hacer una consulta con los datos del primer select....

Para utilizar ajax te recomiendo el framework de javascript que se llama prototype que lo puedes descargar de http://www.prototypejs.org y lo adjuntas a tu archivo de trabajo asi...

<script language="javascript" type="text/javascript" src="prototype.js"></script>

una vez que ya tengamos todas las herramientas listas solo nos queda llamar a la funcion javascritp entonces quedaria asi.....

onChange="BuscaModelo(this.options[this.selectedIndex].value);"

luego creamos la funcion BuscaModelo() en un archivo de javascript.... o lo puedes tener en el mismo archivo pero te recomiendo que crees otro y ahi pongas todas tus funciones para que las puedas volver a utilizar mas tarde....

En este caso creamos un archivo "funciones.js" y ahi vamos a poner las funciones necesarias.... (no olvidar de incluir este archivo como incluiste la libreria prototype)

function BuscaModelo(Value) {
document.getElementById('modelo').options.length = 0;
new Ajax.Request('BuscaModelo.php', { method: 'post',
onLoading: function() { },
onSuccess: function(datos){
var datos1 = datos.responseText;

var i = 0;
var separados= datos1.split("/");
while (separados.length-1 > i) {
var datos_simples = separados[i].split("-");
AgregaCombo(datos_simples[1],datos_simples[0],'modelo');
i=i+1;
}

}, parameters: { value:value },
onComplete: function() { }
});

}

Esta funcion lo que hace es que por medio de ajax.. llamamos al archivo BuscaModelo.php y donde hacemos todo el query... y al final nos devuelve una string con separadores especiales.... por ejemplo...

Vectra-5/Aveo-6/Steem-7/Optra-9/corsa-10

por eso en la funcion hacemos varios split y luego llamamos a la funcion AgregaCombo... asi que tenemos que crear esta funcion...


function AgregaCombo(text, value, cmb_name) {

var variable=new Option(text, value);
var cosa=document.getElementById(cmb_name);
var total = cosa.options.length;
cosa.options[total]=variable;
total = cosa.options.length;
document.getElementById(cmb_name).selectedIndex = (total-1);
}

Esta funcion lo que hace es argegar una opcion al select... con los valores que le mandamos como parametros...

Espero que te sirva.. cualquier pregunta.... estamos aqui para ayudarte....

Saludos,

Richard Bravo
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

RE:3 Select Dependientes

Publicado por Omar Yépez (224 intervenciones) el 14/03/2008 16:54:19
Hola Santos sangarvec{@}hotmail{.}com

Exactamente lo que dijo Richard Bravo es lo que tienes que hacer solo un tips mas.

Cuando utilices la fucnion que llena al combo que es dependiente (hijo) inicializalo ya que si no lo haces en cada llamada AJAX el combo ira creciendo por cada onchange del combo indeendiente (Padre)..... en PROTOTYE no se comose hace yo uso JQuery y es solamenete:

$('#idDelCombo').empty(); // y listo

Espero que te sirva este tips para completar la repuesta de Richard.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

RE:3 Select Dependientes

Publicado por Santi (13 intervenciones) el 14/03/2008 17:02:21
En parte he conseguido lo que quería con un sencillo script de javascript y php, pero ahora lo que no logro es guardar los valores que cojo en los select y pasarlas a un buscador.

El código que te indico es el siguiente:

<form name="formbuscar" method="post">
<script language="JavaScript">
function recarga(form)
{
form.submit();
}
</script>
<TABLE>
<TR>
<TD><b>Seleccione Marca</b></TD>
<TD><b>Seleccione Modelo</b></TD>
<TD><b>Seleccione Año</b></TD>
</TR>
<TR>
<TD>
<?php
//Combo Box 1
mysql_connect("localhost","root","");
$sSQL="SELECT DISTINCT MARCA FROM piezas";
$result=mysql_db_query("charro",$sSQL);

echo '<select name="marca" onChange="javascript:recarga(this.form);">';
echo "<option>-- Seleccione la Marca--</option>";
while ($row=mysql_fetch_array($result))
{
if ($row['MARCA'] == $marca)
{ echo "<option value='".$row['MARCA']."' selected>".$row['MARCA']."</option>";
}
else
{ echo "<option value='".$row['MARCA']."'>".$row['MARCA']."</option>";
}
}
echo "</select>";
?>
</TD>
<TD>
<?
//Combo Box 2
$sSQL="SELECT DISTINCT MODELO FROM piezas WHERE MARCA ='$marca' ORDER BY modelo";
$result=mysql_db_query("charro",$sSQL);
echo '<select name="modelo" onChange="javascript:recarga(this.form);">';
echo "<option>-- Seleccione el Modelo--</option>";

while ($row=mysql_fetch_array($result))
{
if ($row['MODELO'] == $modelo)
{ echo "<option value='".$row['MODELO']."' selected>".$row['MODELO']."</option>";
}
else
{ echo "<option value='".$row['MODELO']."'>".$row['MODELO']."</option>";
}
}
echo "</select>";
?>
</TD>
<TD>
<?
//Combo Box 3
$sSQL="SELECT DISTINCT ANO FROM piezas WHERE MARCA ='$marca' && MODELO = '$modelo' ORDER BY ANO";
$result=mysql_db_query("charro",$sSQL);
echo '<select name="ano" onChange="javascript:recarga(this.form);">';
echo "<option>-- Seleccione el Año--</option>";

while ($row=mysql_fetch_array($result))
{
if ($row['ANO'] == $ano)
{ echo "<option value='".$row['ANO']."' selected>".$row['ANO']."</option>";
}
else
{ echo "<option value='".$row['ANO']."'>".$row['ANO']."</option>";
}
}
echo "</select><BR>";
$mar=$marca;
$mod=$modelo;
$an=$ano;
?>
</TD>
</TR>
</TABLE>
<A HREF="buscador.php?marca=$mar&modelo=$mod&ano=$an">Buscar</A>
</form>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar