Laravel

Insertar múltiples CHECKBOX en Laravel

Insertar múltiples checkbox en Laravel, En este artículo, veremos cómo insertar múltiples valores de casilla de verificación seleccionados en la base de datos en laravel 11. Por lo tanto, aprenderemos cómo almacenar múltiples valores de casilla de verificación en la base de datos usando jquery en laravel 11

En todo proyecto Backend suele presentarse estos detalles de almacenar múltiples casillas en MySQL como ser: Roles de Usuarios, Permisos, etc. y debemos de guardarlo en una matriz en laravel.

Insertar múltiples CHECKBOX en Laravel

Hay varias formas de almacenar las casillas de verificación marcaras, por ejemplo, de un conjunto de 20 checkbox y solo se marcan 10, estos 10 podemos pasarlo por el ciclo foreach para generar varios registros.

Siempre que desee guardar múltiples valores de casilla de verificación en una sola columna en la base de datos en ese momento, este artículo le será útil.

  • Paso 1: Instalar Laravel 11 en Vscode
  • Paso 2: Configurar la base de datos .env
  • Paso 3: Crear la migración y el modelo
  • Paso 4: Crear la ruta
  • Paso 5: Crear el controlador
  • Paso 6: Crear el archivo Blade
  • Paso 7: Ejecutar la aplicación Laravel 11

Paso 1: Instalar Laravel 11 en VSCODE

En este paso, instalaremos Laravel 11 usando el siguiente comando para insertar múltiples valores de casillas de verificación seleccionadas en la base de datos.

composer create-project laravel/laravel checkbox-app

Paso 2: Configurar la base de datos

En este paso, configuraremos los detalles de la base de datos, como el nombre de la base de datos, el nombre de usuario, la contraseña, etc. Esto es vital para que nuestro proyecto trabaje muy bien.

Editar el fichero .env

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel_11_example
DB_USERNAME=root
DB_PASSWORD=root

Paso 3: Crear la migración y el modelo

Ahora, crearemos una migración de base de datos para la tabla de publicaciones y crearemos un modelo de publicaciones utilizando el comando artisan en laravel 11. Veamos un ejemplo

php artisan make:model Article -m

Nota:

El comando anterior creara un modelo de nombre Article y un archivo de migración con el mismo nombre. Por consiguiente, agregue el siguiente código a su archivo de migración que vendría a ser las columnas de la tabla mencionada.

<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

return new class extends Migration
{

public function up()
{
Schema::create('articles', function (Blueprint $table) {
$table->id();
$table->string('name');
$table->string('category');
$table->timestamps();
});
}

public function down()
{
Schema::dropIfExists('posts');
}
};

Ahora, agregaremos el código del siguiente modelo de publicación.

app/Models/Article.php

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Article extends Model
{
    use HasFactory;
    protected $fillable = [
        'name',
        'category',
    ];
   public function setCategoryAttribute($value)
    {
        $this->attributes['category'] = json_encode($value);
    }

    public function getCategoryAttribute($value)
    {
        return $this->attributes['category'] = json_decode($value);
    }

}

Paso 4: Crear ruta

En este paso, agregaremos rutas en el archivo route.php para que funcione la inserción de casillas de verificación.

web/route.php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\ArticleController;

Route::resource('articles', ArticleController::class);

Paso 5: Crear un controlador

Ahora, crearemos un archivo ArticleController.php. Sin embargo, podemos crearlo con la siguiente linea de comando.

php artisan make:controller ArticleController

Por lo tanto, agregue el siguiente código a ese archivo generado.

app/Http/Controllers/ArticleController.php

Este archivo sera el cerebro de nuestra aplicación ya que contendrá todas las instrucciones para la inserción de datos hacia MySQL.

<?php

namespace App\Http\Controllers;

use App\Models\Article;
use Illuminate\Http\Request;

class ArticleController extends Controller
{
public function index()
{
$articles = Article::all();
return view('index',compact('articles'));
}

public function create()
{
return view('multiple_checkbox');
}

public function store(Request $request)
{
$input = $request->all();
$input['category'] = $request->input('category');
Post::create($input);
return redirect()->route('articles.index');
}
}

Paso 6: Crear archivo Blade

En este paso, crearemos un archivo index.blade.php. Por lo tanto, agregue el siguiente código a ese archivo. Aquí se mostrara la vista al usuario final y contendrá la información de nuestro formulario.

resources/views/index.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>Insertar Multiple Checkbox a Laravel 11 </title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha256-aAr2Zpq8MZ+YA/D6JtRD3xtrwpEz2IqOS+pWD/7XKIw=" crossorigin="anonymous" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha256-OFRAJNoaD8L3Br5lglV7VyLRf0itmoBzWUoM+Sji4/8=" crossorigin="anonymous"></script>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-md-6 offset-3 mt-5">
                <div class="card">
                    <div class="card-header bg-info">
                        <h6 class="text-white">Insert Multiple Checkbox Values</h6>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-12 text-right mb-3">
                                <a href="{{ route('articles.create') }}" class="btn btn-success">Create</a>
                            </div>
                        </div>
                        <table class="table table-bordered">
                            <tr>
                                <th>Name</th>
                                <th>Category</th>
                            </tr>
                            @foreach($articles as $article)
                            <tr>
                                <td>{{ $article->name }}</td>


                                <td>
                                    @foreach($article->category as $value)
                                        {{$value}},
                                    @endforeach
                                </td>
                            </tr>
                            @endforeach
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

resources/views/multiple_checkbox.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>Multiple Checkbox Value In Database</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha256-aAr2Zpq8MZ+YA/D6JtRD3xtrwpEz2IqOS+pWD/7XKIw=" crossorigin="anonymous" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha256-OFRAJNoaD8L3Br5lglV7VyLRf0itmoBzWUoM+Sji4/8=" crossorigin="anonymous"></script>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-md-6 offset-3 mt-5">
                <div class="card">
                    <div class="card-header bg-info">
                        <h6 class="text-white">Multiple Checkbox Value In Database</h6>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-12 text-right mb-3">
                                <a href="{{ route('articles.index') }}" class="btn btn-primary">Back</a>
                            </div>
                        </div>
                        <form method="post" action="{{ route('articles.store') }}" enctype="multipart/form-data">
                            @csrf
                            <div class="form-group">
                                <label><strong>Name :</strong></label>
                                <input type="text" name="name" class="form-control"/>
                            </div>  
                            <div class="form-group">
                                <label><strong>Category :</strong></label><br>
                                <label><input type="checkbox" name="category[]" value="laravel"> Laravel</label>
                                <label><input type="checkbox" name="category[]" value="PHP"> PHP</label>
                                <label><input type="checkbox" name="category[]" value="MySQL"> MySQL</label>
                                <label><input type="checkbox" name="category[]" value="jquery"> jQuery</label>
                            </div>  


                            <div class="form-group text-center">
                                <button type="submit" class="btn btn-success btn-sm">Save</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

Paso 7: Ejecutar la aplicación Laravel 11

Ahora, insertaremos múltiples valores de casillas de verificación seleccionados en la base de datos con el siguiente comando:

php artisan serve

Guardar un solo checkBox en laravel

Si solo deseamos guardar un solo checkbox en Laravel podemos realizar los siguientes pasos:

En nuestro blade declaramos el checkbox

<divclass="form-group">
<inputtype="checkbox"name="nueva_ventana"value="1">
<labelclass="control-label">Abrir en una nueva ventana</label>
</div>

Y en nuestro controller en la función store declaramos lo siguiente:

$requestData = $request->all();
// Si la casilla de verificacion esta marcada, se almacenara e valor del checkbox,
// caso contrario almacenara cero (0) en MySQL
$requestData['nueva_ventana'] = $request->nueva_ventana ?? '0'; // Checkbox
Banner::create($requestData);

En resumen

En laravel podemos almacenar multiples Checkbox o un solo checkbox usando las bondades del framework Laravel.

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