Cómo configurar el envío de formularios en Laravel

En nuestra pequeña aplicación de juegos, todavía no tenemos una manera de agregar nuevos juegos a la base de datos utilizando la aplicación en sí.

Agregar juegos / crear ruta y método GamesController @ create

Por convención, cuando desea mostrar un formulario, solicitud GETgames/create . GamesController @ create . games/createy necesitamos un método en el controlador para GamesController @ create.

rutas / web.php

1
2
3
4
5
6
7
<?php
 
Route::get('games', 'GamesController@index');
 
Route::get('games/{id}', 'GamesController@show');
 
Route::get('games/create', 'GamesController@create'); 

app / Http / Controllers / GamesController.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<?php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
use App\Game;
 
class GamesController extends Controller
{
    public function index()
    {
        $games = Game::all();
        return view('games.index', ['games' => $games]);
    }
    
    public function show(Game $id)
    {
        return view('games.show', ['game' => $id]);
    }
    
    public function create()
    {
        return 'it works';
    }
}

Prueba la ruta

Con la nueva ruta y el nuevo método de controlador, probémosla rápidamente en el navegador. http://54.dev/games/create , notamos un problema.

Lo sentimos, la página que estás buscando no se pudo encontrar.
2/2
NotFoundHttpException en Handler.php línea 131:
No hay resultados de consultas para el modelo [App \ Game].

Uh oh, eso no es genial. http://54.dev/games/create , en realidad estamos activando Route :: get ('games / {id}', 'GamesController @ show'); ruta y esto no es lo que queremos.

1
2
3
4
5
6
7
<?php
 
Route::get('games', 'GamesController@index');
 
Route::get('games/create', 'GamesController@create');
 
Route::get('games/{id}', 'GamesController@show');

Cuando visitamos la ruta ahora, obtenemos el bonito texto de 'funciona' para que sepamos que la ruta y el método de controlador que queremos que funcionen. create()método para representar un archivo de vista para que podamos ver el formulario.

1
2
3
4
    public function create()
    {
        return view('games.create');
    }

Cree una nueva vista de create.blade.php y agregue un formulario

Dentro de los recursos / vistas / juegos continúe y agregue un archivo de vista llamado create.blade.php. subir una imagen para el juego.

recursos / vistas / juegos / create.blade.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
@extends('layouts.master')
 
@section('content')
 
    <h2>Add a game</h2>
 
    <form method="post" action="/games" enctype="multipart/form-data">
        {{ csrf_field() }}
        <div class="form-group row">
            <label for="titleid" class="col-sm-3 col-form-label">Game Title</label>
            <div class="col-sm-9">
                <input name="title" type="text" class="form-control" id="titleid" placeholder="Game Title">
            </div>
        </div>
        <div class="form-group row">
            <label for="publisherid" class="col-sm-3 col-form-label">Game Publisher</label>
            <div class="col-sm-9">
                <input name="publisher" type="text" class="form-control" id="publisherid"
                       placeholder="Game Publisher">
            </div>
        </div>
        <div class="form-group row">
            <label for="releasedateid" class="col-sm-3 col-form-label">Release Date</label>
            <div class="col-sm-9">
                <input name="releasedate" type="text" class="form-control" id="releasedateid"
                       placeholder="Release Date">
            </div>
        </div>
        <div class="form-group row">
            <label for="gameimageid" class="col-sm-3 col-form-label">Game Image</label>
            <div class="col-sm-9">
                <input name="image" type="file" id="gameimageid" class="custom-file-input">
                <span style="margin-left: 15px; width: 480px;" class="custom-file-control"></span>
            </div>
        </div>
        <div class="form-group row">
            <div class="offset-sm-3 col-sm-9">
                <button type="submit" class="btn btn-primary">Submit Game</button>
            </div>
        </div>
    </form>
 
@endsection

Visitar http://54.dev/games/create nos muestra un formulario bastante atractivo para enviar un nuevo juego.
formulario create-blade-php para enviar datos

Repasemos algunos puntos importantes sobre el nuevo formulario.

El método debe configurarse para publicar : cada formulario tendrá un atributo llamado método . el tipo de solicitud HTTP que realizará con el formulario. POST .
El acción se establece en / games : el otro atributo al que debemos prestar atención en los formularios es el acción . una solicitud posterior a/games
El enctype se establece en multipart / form-data : dado que incluimos la capacidad de cargar una imagen, necesitamos establecer el enctype en multipart / form-data.
Se requiere
cada entrada tiene un nombre único nombre con un conjunto de valores único.
tipo de envío : para enviar el formulario, ¡necesitará un botón con su tipo configurado para enviar!

Agregar ruta de publicación / juegos y método GamesController @ store

Para procesar realmente los datos que ingresamos en nuestro formulario, necesitamos la ruta asociada y el método del controlador para hacerlo.

1
2
3
4
5
6
7
8
9
<?php
 
Route::get('games', 'GamesController@index');
 
Route::get('games/create', 'GamesController@create');
 
Route::get('games/{id}', 'GamesController@show');
 
Route::post('games', 'GamesController@store');

Obtener datos del envío del formulario

Todavía no vamos a intentar guardar ningún dato. título , editor , fecha de lanzamiento e imagen . store()método en nuestro GamesController de esta manera por un segundo rápido.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
use App\Game;
 
class GamesController extends Controller
{
    public function index()
    {
        $games = Game::all();
        return view('games.index', ['games' => $games]);
    }
    
    public function show(Game $id)
    {
        return view('games.show', ['game' => $id]);
    }
    
    public function create()
    {
        return view('games.create');
    }
    
    public function store()
    {
        var_dump(request('title'));
        var_dump(request('publisher'));
        var_dump(request('releasedate'));
        var_dump(request('image'));
    }
}

Avancemos y enviemos nuestro formulario ahora para ver qué obtenemos.
enviar un formulario con carga de archivos

El resultado de deshacerse de nuestros datos de solicitud se ve así.
Datos de solicitud de inspección del envío del formulario laravel

Esto muestra que definitivamente estamos obteniendo todos los datos que queremos.

Ahora queremos poder guardar el título , el editor , la fecha de lanzamiento y la imagen en la base de datos.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<?php
 
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
 
class CreateGamesTable extends Migration
{
    /**
     * Run the migrations.
     *
     * @return void
     */
    public function up()
    {
        Schema::create('games', function (Blueprint $table) {
            $table->increments('id');
            $table->string('title');
            $table->string('publisher');
            $table->integer('releasedate');
            $table->string('image');
            $table->timestamps();
        });
    }
    
    /**
     * Reverse the migrations.
     *
     * @return void
     */
    public function down()
    {
        Schema::dropIfExists('games');
    }
}

Ahora vamos a ejecutar php artisan migrate: refresh , que restablecerá y volverá a ejecutar todas las migraciones.
actualización de migración artesanal de php

Almacenar el juego en la base de datos

Con nuestra tabla de juegos ahora actualizada para incluir una ruta para un archivo de imagen, estamos listos para almacenar un juego en la base de datos. store()método para hacer eso por nosotros.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<?php
 
namespace App\Http\Controllers;
 
use Illuminate\Http\Request;
use App\Game;
 
class GamesController extends Controller
{
    public function index()
    {
        $games = Game::all();
        return view('games.index', ['games' => $games]);
    }
    
    public function show(Game $id)
    {
        return view('games.show', ['game' => $id]);
    }
    
    public function create()
    {
        return view('games.create');
    }
    
    public function store()
    {
        $game = new Game;
        
        $game->title = request('title');
        $game->publisher = request('publisher');
        $game->releasedate = request('releasedate');
        $game->image = request()->file('image')->store('public/images');
        $game->save();
    }
}

Lo que sucede en este store()método es bastante sencillo. request()función auxiliar para acceder a los datos que deseamos del formulario. $ game-> image = request () -> file ('image') -> store ('public / images'); Aquí suceden dos cosas a la vez. storage / app / public / images . ruta de la imagen se almacena, por $game->image lo que recuperamos la fuente de la imagen cuando queremos mostrarla en el navegador más adelante.

nuevo juego se agrega a través del formulario de éxito

¡Si!

Cómo mostrar imágenes almacenadas

Vamos a necesitar actualizar nuestra show.blade.php vista para que podamos hacer uso de nuestro archivo de imagen recién cargado.

Eliminar esta línea resaltada

1
2
3
4
5
6
7
8
9
10
11
12
13
14
@extends('layouts.master')
 
@section('content')
 
    <div class="card" style="width: 270px;margin: 5px">
        <img class="card-img-top" src="/{{ $game->title }}.png" alt="Card image cap">
        <div class="card-block">
            <h3 class="card-title">{{ $game->title }}</h3>
            <p class="card-text">{{ $game->title }} is published by {{ $game->publisher }}</p>
            <a href="/games" class="btn btn-primary">List Games</a>
        </div>
    </div>
 
@endsection

Y reemplazar así

1
2
3
4
5
6
7
8
9
10
11
12
13
14
@extends('layouts.master')
 
@section('content')
 
    <div class="card" style="width: 270px;margin: 5px">
        <img class="card-img-top" src="{{ Storage::url($game->image)  }}" alt="Card image cap">
        <div class="card-block">
            <h3 class="card-title">{{ $game->title }}</h3>
            <p class="card-text">{{ $game->title }} is published by {{ $game->publisher }}</p>
            <a href="/games" class="btn btn-primary">List Games</a>
        </div>
    </div>
 
@endsection

Cree un enlace simbólico de public / storage a storage / app / public

Usando el método que hemos tomado anteriormente, las imágenes se almacenarán en el directorio de almacenamiento, o más específicamente en storage / app / public / images. enlace simbólico de public / storage a storage / app / public. php artisan storage: link.

mklink / DC: \ localdev \ 54 \ public \ storage C: \ localdev \ 54 \ storage \ app \ public

Agreguemos un juego más para asegurarnos de que todo funcione.
formulario enviar con carga de archivos laravel

¡Parece que está funcionando muy bien!
carga de archivos y visualización exitosa

Cómo configurar el envío de formularios en el resumen de Laravel

Dimos un gran paso en este tutorial.

Post Top Ad

jueves, 30 de julio de 2020

Cómo configurar el envío de formularios en Laravel

Agregar juegos / crear ruta y método GamesController @ create

rutas / web.php

app / Http / Controllers / GamesController.php

Prueba la ruta

Cree una nueva vista de create.blade.php y agregue un formulario

recursos / vistas / juegos / create.blade.php

Agregar ruta de publicación / juegos y método GamesController @ store

Obtener datos del envío del formulario

Almacenar el juego en la base de datos

Cómo mostrar imágenes almacenadas

Cree un enlace simbólico de public / storage a storage / app / public

Cómo configurar el envío de formularios en el resumen de Laravel

No hay comentarios.:

Publicar un comentario

outbrain

Te puede Interesar

Ads

Ads

Publicidad

Siguenos en Facebook

Ads revisión

Recent

Popular

Comment

ads

Archive

Países visitantes

Ads

Páginas

Acerca de Instinto Programador

De donde nos visitan

Total de visitas

Deposito