SELECTS (JS y PHP)

[biblio]

Finalmente terminé listas dependientes, y se los paso calientito.

Antes que nada copien el "DUMP", guardenlo como insert.sql, o como quieran llamarlo Y EJECUTENLO.

Esta parte lo hice a pedido de Cluster, jeje.

Código:

DROP TABLE IF EXISTS `categorias`;
CREATE TABLE `categorias` (
  `IdCategoria` tinyint(4) NOT NULL auto_increment,
  `Categoria` varchar(50) NOT NULL default '',
  PRIMARY KEY  (`IdCategoria`)
) TYPE=MyISAM AUTO_INCREMENT=9 ;

#
# Volcar la base de datos para la tabla `categorias`
#

INSERT INTO `categorias` (`IdCategoria`, `Categoria`) VALUES (1, 'Memorias');
INSERT INTO `categorias` (`IdCategoria`, `Categoria`) VALUES (2, 'Impresoras');
INSERT INTO `categorias` (`IdCategoria`, `Categoria`) VALUES (3, 'Redes LAN/WAN');
INSERT INTO `categorias` (`IdCategoria`, `Categoria`) VALUES (4, 'Multimedia');
# --------------------------------------------------------

#
# Estructura de tabla para la tabla `subcategorias`
#

DROP TABLE IF EXISTS `subcategorias`;
CREATE TABLE `subcategorias` (
  `IdSubCategoria` tinyint(4) NOT NULL auto_increment,
  `IdCategoria` tinyint(4) NOT NULL default '0',
  `SubCategoria` varchar(50) NOT NULL default '',
  PRIMARY KEY  (`IdSubCategoria`)
) TYPE=MyISAM PACK_KEYS=0 AUTO_INCREMENT=13 ;

#
# Volcar la base de datos para la tabla `subcategorias`
#

INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (1, 1, 'DDR PC266');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (2, 1, 'DIMM PC 66');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (3, 1, 'RIMM');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (4, 2, 'Matricial');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (5, 2, 'Laser');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (6, 2, 'Tinta');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (7, 3, 'HUB');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (8, 3, 'SWITCH');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (9, 3, 'Router');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (10, 4, 'Microfono');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (11, 4, 'Parlantes');
INSERT INTO `subcategorias` (`IdSubCategoria`, `IdCategoria`, `SubCategoria`) VALUES (12, 4, 'Camara');

Acá va el código, todo explicadito.

Código PHP:

  <?php
if(isset($_POST['send'])){
    echo "El valor de Categoria : <b>".$_POST['cat']."</b><br>";
    echo "El valor de SubCategoria : <b>".$_POST['sub']."</b>";
}
 
$server  = "192.168.1.8";
$user    = "biblio";
$password= "*******";
$database= "test";    
 
$mysql = mysql_connect($server, $user, $password) or die(mysql_error()); // hacemos la conexión al servidor MySQL 
 
mysql_select_db($database, $mysql) or die(mysql_error()); // seleccionamos la base de datos MySQL
 
$sqlcat        = "SELECT c.IdCategoria,c.Categoria "  // creamos nuestra consulta para (Categorias)
                . "FROM Categorias c "
                . "ORDER BY c.Categoria ASC";        
 
$sqlsubcat    = "SELECT s.IdSubCategoria,s.IdCategoria,s.SubCategoria " // creamos nuestra consulta para (SubCategorias)
                . "FROM SubCategorias s "
                . "ORDER BY s.IdCategoria"; // es imprescindible que esté ordenado de ese modo, vaya al final para leer mas 1(*). 
 
?>
<form name="main" method="post" action="lists.php">
  <select name="cat" style="width:180px;" onChange="_addList(this.form.cat[selectedIndex].value);">
  <option selected>seleccione una categoria</option>
<?php
    $resultcat = mysql_query($sqlcat, $mysql); //enviamos nuestra sentencia SQL($sqlcat) a MySQL
 
    while($rows = mysql_fetch_object($resultcat)) : // comenzamos a recorrer el resultado como un objeto
        echo "<option value=".$rows->IdCategoria.">".$rows->Categoria."</option>\n"; // imprimo en las opciones del combo
    endwhile; 
?>
  </select>
  <select name="sub" style="width:180px;">
  </select>
 <input name="send" type="submit" id="send" value="Enviar">
 </form>
<script language="Javascript">
function _tupla( field1, field2 ){// que es tupla? informense por ustedes mismos, usen google, jeje
    this.field1 = field1;
    this.field2 = field2;
}
 
<?php
    $resultsubcat = mysql_query($sqlsubcat, $mysql);   //enviamos nuestra sentencia SQL($sqlsubcat) a MySQL 
 
    $counterphp = 0; // variable que nos ayudará para generar loa arrays
    $cat = 0;         // variable para verificar cuando cambia el valor de (IdCategoria).
 
    while($rows = mysql_fetch_object($resultsubcat)):
        if ($cat != $rows->IdCategoria){ // este if, detecta el cambio de la categoria
            $counterphp = 0; // comienzo a contar en 0
            $cat = $rows->IdCategoria;
            echo "var option".$cat." = new Array();\n"; // creamos un nuevo array, y lo imprimimos
        }
        echo "option".$cat."[".$counterphp."]=new _tupla('".$rows->SubCategoria."','".$rows->IdSubCategoria."');\n"; 
        $counterphp ++; // incrementamos el valor en uno 
    endwhile;
?>
 
var counterjs; 
 
function _addList(array){// agego el contenido en "sub", a partir del valor de la opcion escogida en la lista "cat"
    _clearList();
    array = eval("option" + array);
    for (counterjs=0; counterjs < array.length; counterjs++) {
        // agregamos los valores correpondiente en el combo "sub"
        var optionObj = new Option( array[counterjs].field1, array[counterjs].field2 );
        main.sub.options[counterjs] = optionObj;
    } 
    main.sub.disabled = false; // habilito y mando el foco a "sub"
    main.sub.focus();
} 
 
function _clearList() { // limpio el contenido de "sub"
    main.sub.length=0;
}
 
function _controlError() { // esta función nos ayuda controlar el error. 2(*)
    return true;
}
 
main.sub.disabled = true; // deshabilito el "sub"
 
window.onerror = _controlError;
</script>
 
<?php
    mysql_close($mysql); // cerramos la conexion con MySQL
 
/*
(*) 
1.) La razón por la que debe ir ordenado por el "idcategoria" es,
porque al momento de hacer la comparación "$cat != $rows->IdCategoria", se produce un desorden, mostrando 
datos faltantes en el "sub".
 
2.) Cuando se produce el error?, cuando seleccionamos el "cat", y no hubo resultados para esa opcion.
Vale decir, cuando la categoria no tiene subcategorias. 
no me cree?. quite window.onerror = _controlError; y aumente una categoria. y ejecutelo.
 
NOTAS:
cat = me refiero a la lista desplegable 1, que contiene la categoria
sub = me refiero a la lista desplegable 2, que contiene la subcategoria
*/
?>   

Cualquier comentario, y arreglo es bienvenido.

Saludos