Créer un formulaire dans Laravel

Présentation

• Laravel fournit diverses balises intégrées pour gérer les formulaires HTML.
• Tous les balises du formulaire HTML sont générés à l'aide de Laravel.
• La création de formulaires est très courante pour mettre à jour ou créer des ressources dans la base de données.
Dans ce tutoriel on

Réalisation

1. Créer un projet Laravel 8

   • ouvrir votre terminal et accéder au répertoire de votre serveur Web local : pour moi c'est C:\wamp64\www\laravel>
   • Exécuter la commande suivante pour installer un nouveau projet Laravel 8.
   • composer create-project laravel/laravel --prefer-dist creation-formulaire-laravel8
   • Toujours dans votre terminal, placez-vous dans le dossier du projet crée: cd creation-formulaire-laravel8

2. Configuration de la base de données à l'aide du fichier Env

   • Établir une connexion à la base de données
     • Ajouter les détails de la base de données dans le fichier .env comme suit

     DB_CONNECTION=mysql
     DB_HOST=localhost
     DB_PORT=3306
     DB_DATABASE=gestion-notes
     DB_USERNAME=root
     DB_PASSWORD=

3. Modifier le fichier database.php
   'charset' => 'utf8mb4', en 'charset' => 'utf8', et 'collation' => 'utf8mb4_unicode_ci', en 'collation' => 'utf8_unicode_ci',

4. Créer un fichier de modèle et de migration pour ajouter le contenu du formulaire.

   • N'oublier pas que notre objectif est de créer un formulaire Laravel 8 et de stocker les données du formulaire dans la base de données.
   • Créer le modèle pour définir le schéma de table pour le formulaire, exécuter la commande suivante pour créer le modèle: php artisan make:model Etudiant -m
   • Ouvrir le fichier database/migrations/xxxx_xx_xx_xxxxxx_create_etudiants_table.php et ajouter les valeurs de formulaire que nous devons stocker dans la base de données.

   

   public function up()
       {
           Schema::create('etudiants', function (Blueprint $table) {
               $table->id();
               $table->string('prenomNom');
               $table->date('dteNaissance');
               $table->string('email');
               $table->string('telephone');
               $table->text('adresse');
               $table->timestamps();
           });
       }

5. Modifier le fichier app/Models/Etudiant.php comme suit:
6. public $fillable = ['prenomNom', 'dteNaissance', 'email', 'telephone', 'adresse'];
7. Exécuter la migration par la commande suivante: php artisan migrate

8. Créer des routes

   • Ouvrirle fichier web.php, qui se trouve dans le répertoire routes. Ajouter ensuite les routes suivantes dans ce fichier:

   Route::get('/form-inscription', 'App\Http\Controllers\EtudiantController@createUserForm');
   Route::post('/form-inscription', 'App\Http\Controllers\EtudiantController@UserForm');

9. Création du contrôleur

   • Pour créer le contrôleur (Controller), exécutez la commande ci-dessous :
   • php artisan make:controller EtudiantController
   • La commande ci-dessus créera le fichier EtudiantController.php, qui se trouve dans le répertoire /app/Http/Controllers/.

   

   • Alors ouvrir le fichier EtudiantController.php et ajouter-y le code suivant:

   <?php
   
   namespace App\Http\Controllers;
   
   use Illuminate\Http\Request;
   //use App\Etudiant;
   class EtudiantController extends Controller
   {
       // Create Form
     public function createUserForm(Request $request) {
       return view('form-inscription');
     }
     // Store Form data in database
     public function UserForm(Request $request) {
   
         // Form validation
         $this->validate($request, [
             'prenomNom' => 'required',
             'dteNaissance'=>'required',
             'email' => 'required|email',
             'telephone' => 'required|regex:/^([0-9\s\-\+\(\)]*)$/|min:8',
             'adresse' => 'required'
          ]);
   
         //  Store data in database
         'App\Models\Etudiant'::create($request->all());
         //
         return back()->with('success', 'Les données ont été enregistrées avec succès.');
     }
   }

10. Créer un fichier Blade pour ajouter le formulaire de publication

    • Dans le dossier views créer le fichier form-inscription.blade.php

    

    • Ajouter le code html suivant dans form-inscription.blade.php:

    <!DOCTYPE html>
    <html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Form Validation in Laravel</title>
        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css">
        <!-- Custom CSS -->
        <link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}">
    </head>
    
    <body>
        <div class="container mt-5">
    
            <!-- Success message -->
            @if(Session::has('success'))
            <div class="alert alert-success">
                {{Session::get('success')}}
            </div>
            @endif
    
            <form action="" method="post" action="{{ action('App\Http\Controllers\EtudiantController@createUserForm') }}">
    
                @csrf
    
                <div class="form-group">
                    <label>Prénom & Nom</label>
                    <input type="text" class="form-control {{ $errors->has('prenomNom') ? 'error' : '' }}" name="prenomNom" id="prenomNom">
    
                    <!-- Error -->
                    @if ($errors->has('prenomNom'))
                    <div class="error">
                        {{ $errors->first('prenomNom') }}
                    </div>
                    @endif
                </div>
    
                <div class="form-group">
                    <label>Date Naissance</label>
                    <input type="text" class="form-control {{ $errors->has('dteNaissance') ? 'error' : '' }}" name="dteNaissance"
                        id="dteNaissance">
    
                    @if ($errors->has('dteNaissance'))
                    <div class="error">
                        {{ $errors->first('dteNaissance') }}
                    </div>
                    @endif
                </div>
    
                <div class="form-group">
                    <label>Email</label>
                    <input type="email" class="form-control {{ $errors->has('email') ? 'error' : '' }}" name="email"
                        id="email">
    
                    @if ($errors->has('email'))
                    <div class="error">
                        {{ $errors->first('email') }}
                    </div>
                    @endif
                </div>
    
                <div class="form-group">
                    <label>Téléphone</label>
                    <input type="text" class="form-control {{ $errors->has('telephone') ? 'error' : '' }}" name="telephone"
                        id="telephone">
    
                    @if ($errors->has('telephone'))
                    <div class="error">
                        {{ $errors->first('telephone') }}
                    </div>
                    @endif
                </div>
    
                <div class="form-group">
                    <label>Adresse</label>
                    <textarea class="form-control {{ $errors->has('adresse') ? 'error' : '' }}" name="adresse" id="adresse"
                        rows="4"></textarea>
    
                    @if ($errors->has('adresse'))
                    <div class="error">
                        {{ $errors->first('adresse') }}
                    </div>
                    @endif
                </div>
    
                <input type="submit" name="send" value="Submit" class="btn btn-dark w-100">
            </form>
        </div>
    </body>
    
    </html>
    

11. Démarrez le serveur de développement

    • Ouvrir le terminal de votre Visual Studio Code et exécuter la commande suivante : php artisan serve

12. Exécutez l'application Laravel sur le navigateur

    • Ouvrir votre navigateur et taper l'URL suivante : http://127.0.0.1:8000/form-inscription