0

tengo estas 2 tablas (platos,categorias). y quiero ordenar mis resultados mysql para lograr este resultado:

<select>
<optgroup label="nombre de categoria">
<option>plato de la categoria</option>
</optgroup>
<optgroup label="nombre de categoria 2">
<option>plato de la categoria 2</option>
<option>plato de la categoria 2</option>
<option>plato de la categoria 2</option>
<option>plato de la categoria 2</option>
</optgroup>
<optgroup label="nombre de categoria 3">
<option>plato de la categoria 3</option>
<option>plato de la categoria 3</option>
</optgroup>
</select>

prove con lo siguiente:

guarde mis resultados en un array luego con un for recorri todos esos resultados y los guarde en un array con el indice de la categoria:

$platos["id_categoria"]["id_plato"] = array("id_categoria"=>id_categoria,"id_plato"=>id_plato,"nombre_plato"=>nombre_plato);

luego recorro todos los array y los vuelvo a ordenar pero me parece demaciado procedimiento para algo tan simple.

codigos mysql php que use: 1: consulta:

$query = "
select pla.id_plato,pla.nombre,pla.id_categoria,pla.precio,
cat.nombre as cat_nombre
from platos pla
left join categorias cat on cat.id_categoria = pla.id_categoria
";

1 respuesta 1

1

Tal vez te convenga incluir el orden en que deseas que se obtengan los datos de la consulta, ya sea por categoría, nombre de plato, precio o como lo tengas definido en tu proyecto.

Un formato de arreglo que puede ser útil es:

[
  "Categoría 1" => [
    1 => ["Plato 1", "100"], // ID de plato => [Nombre, Precio]
    2 => ["Plato 2", "120"],
    3 => ["Plato 3", "150"],
  ],
  "Categoría 2" => [
    3 => ["Plato 3", "80"],
    4 => ["Plato 4", "75"],
    5 => ["Plato 5", "110"],
  ],
]

La representación del arreglo es ya con la estructura que necesitas para armar el select y no es tan complicado obtenerlo:

// Crear arreglo de todos los platos
$platos = [];
while($row = $funcion_para_extraer_datos($consulta)) {
    // Verificar que existe la categoría:
    if(!isset($platos[$row['cat_nombre']])) {
        // Agregar categoría como arreglo vacío
        $platos[$row['cat_nombre']] = [];
    }
    // Agregar plato en la categoría correspondiente
    $platos[$row['cat_nombre']][$row['id_plato']] = [$row['nombre'], $row['precio']];
}

Para generar el select:

<select name="platos">
<option value="">-- Selecciona --</option>
<?php
// Recorrer categorías
foreach($platos as $cat => $catPlatos) {
    // Crear grupo
    echo "<optgroup label=\"$cat\">\n";
    // Recorrer platos en la categoría
    foreach($catPlatos as $id => $plato) {
        // Agregar precio en dataset,
    // por si necesitas usarlo para realizar cálculos
    echo "<option value=\"$id\" data-precio=\"{$plato[1]}\">{$plato[0]}</option>\n";
    }
    // Cerrar grupo
    echo "</optgroup>";
}
?>
</select>

Resultado y un poco de javascript agregado para mostrar para qué puede servir tener el precio en cada opción:

// Puedes obtener el precio muy fácil
// Escuchar evento onchange del select
document.querySelector('[name="platos"]').addEventListener('change', function() {
    // selectedIndex es el índice de la opción seleccionada
    let index = this.selectedIndex;
    // Obtener opción actual por índice
    let opc = this.options[index];
    // Verificar que tiene valor
    if(opc.value) {
        // ID de plato es el valor de la opción
        let platoId = opc.value;
        // Nombre es el texto de la opción
        let platoNombre = opc.text;
        // Precio está en atributo de datos
        let platoPrecio = opc.dataset.precio;

        // Ver todos los datos en consola
        console.log(platoId, platoNombre, platoPrecio);
    }
});
<select name="platos">
<option value="">-- Selecciona --</option>
<optgroup label="Categoría 1">
<option value="1" data-precio="100">Plato 1</option>
<option value="2" data-precio="120">Plato 2</option>
<option value="3" data-precio="150">Plato 3</option>
</optgroup><optgroup label="Categoría 2">
<option value="3" data-precio="80">Plato 3</option>
<option value="4" data-precio="75">Plato 4</option>
<option value="5" data-precio="110">Plato 5</option>
</optgroup></select>

Probablemente me extendí y me salí un poco del tema de la pregunta, pero creo que esta información te puede ser útil para realizar acciones dentro de la página sin tener que recargar.

1
  • Esta es la solucion, gracias amigo, si tan solo ubiera mas gente como tu con esos animos de ayudar a otros colegas. Bendiciones
    – IntruzO
    Commented el 12 sept. 2020 a las 1:36

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.