Laravel

Generar combinaciones por talla y color múltiple en Laravel

Generar combinaciones por talla y color múltiple en Laravel. Genial, si quieres generar todas las combinaciones posibles entre tallas y colores múltiples para un producto en Laravel (por ejemplo, cuando seleccionas varias tallas y varios colores desde un formulario).

Cómo generar combinaciones por talla y color múltiple en Laravel?

Para generar combinaciones debemos de cumplir estos pasos:

  • Declarar nuestra etiqueta <select> con el atributo múltiple. Tanto para colores y tallas
  • Agregar corchetes a los nombres de etiqueta  ejemplo colores[] y talla[]
  • Procesar esos valores en el controlador usando el ciclo foreach

Escenario de resultado final

Queremos crear variantes del producto X combinando con tallas y colores múltiples:

  • Tallas: S, M, L → IDs: [1, 2, 3]
  • Colores: Rojo, Azul → IDs: [4, 5]

Resultado esperado en el navegador:

  • S – Rojo
  • S – Azul
  • M – Rojo
  • M – Azul
  • L – Rojo
  • L – Azul

A continuación, veremos los pasos a seguir para obtener el resultado final en Laravel

Paso 01: Preparar el fichero blade

Es esencial declarar el atributo múltiple y agregar corchetes a los nombres de la etiqueta. Veamos un ejemplo.

<form>
<label for="color">Color:</label>
<select multiple id="color" name="colores[]">
<option value="rojo">Rojo</option>
<option value="azul">Azul</option>
<option value="verde">Verde</option>
<option value="negro">Negro</option>
</select>

<br><br>

<label for="talla">Talla:</label>
<select id="talla" name="tallas[]">
<option value="s">S</option>
<option value="m">M</option>
<option value="l">L</option>
<option value="xl">XL</option>
</select>
</form>

Paso 2: Recibir datos desde el formulario

En nuestro controlador debemos de validar los valores enviados desde el formulario (Blade)

$request->validate([
'product_id' => 'required|exists:products,id',
'sizes' => 'required|array',
'colors' => 'required|array',
'stock' => 'required|integer',
]);

Paso 3: Generar combinaciones en controlador

Esto lo podemos hacer en nuestro controlador haciendo uso de la variable $request y usando el ciclo foreach múltiple.

$product_id = $request->product_id;
$sizes = $request->sizes;     // Ej: [1, 2, 3]
$colors = $request->colors;   // Ej: [4, 5]


foreach ($sizes as $size_id) {
    foreach ($colors as $color_id) {
        ProductVariant::updateOrCreate(
            [
                'product_id' => $product_id,
                'size_id' => $size_id,
                'color_id' => $color_id,
            ],
            [
                'stock' => $request->stock,
            ]
        );
    }
}

Al procesar los valores creará o actualizará todas las combinaciones de talla y color para un producto porque estamos usando updateOrCreate

Paso 4: Ejemplo de Formulario en Blade

Crearemos un fichero blade completo con todos los requisitos necesarios

<form method="POST" action="{{ route('variants.store') }}">
    @csrf
    <select name="product_id">
        @foreach($products as $product)
            <option value="{{ $product->id }}">{{ $product->name }}</option>
        @endforeach
    </select>


    <label>Tallas:</label>
    <select name="sizes[]" multiple>
        @foreach($sizes as $size)
            <option value="{{ $size->id }}">{{ $size->name }}</option>
        @endforeach
    </select>


    <label>Colores:</label>
    <select name="colors[]" multiple>
        @foreach($colors as $color)
            <option value="{{ $color->id }}">{{ $color->name }}</option>
        @endforeach
    </select>
    <input type="number" name="stock" placeholder="Stock">
    <button type="submit">Generar variantes</button>
</form>

De esta manera obtendremos combinaciones precisas usando Laravel y recuerda que podemos complementarlos con otros valores como ser: Sede, Precios, Sku, etc.

Mostrar más

Nestor Tapia

Bloggero, amante de la programación PHP, innovador y me fascina compartir información. Desde que conocí el entorno informatico y el internet me llamó la atención la programación, Por tal motivo he creado mi blog BAULPHP.COM para compartir mis experiencias con todos ustedes. ¡Gracias por leerme!.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Botón volver arriba
Esta web utiliza cookies propias para su correcto funcionamiento. Contiene enlaces a sitios web de terceros con políticas de privacidad ajenas que podrás aceptar o no cuando accedas a ellos. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad