دورة laravel للمبتدئين الدرس السادس


فهاد الدرس السادس من دورة laravel للمبتدئين غادي نشوفوا كيفاش نتعاملو مع les formulaires ف laravel غادي نشوفوا كيفاش نديرو ل validation من بعد غادي نشوفوا كيفاش نزيدو المعلومات لي دخلنا فالفورم فقاعدة البيانات.


1- إضافة الفورم فالصفحة الرئيسية

غادي نزيدو الفورم ديالنا فالملف welcome.blade.php فالفورم عندي جوج ديال الحوايج لي غادي نشرح :

- {{('route('post.add)}} ولي كتعني بلي غادي نرسل المعلومات ل route post.add ولي غادي نزيدوه من بعد.

- csrf_field ولي هي ضرورية فكل فورم ف laravel ولي كتعطي واحد token لي خاصة بكل مستخدم ف token عبارة على كود خاص كيرافق المستخدم ديال الموقع فجميع مراحل التصفح.

باقي الكود عادي فالكود لي زدنا ف welcome.blade.php هو :

                                //welcome.blade.php

<!doctype html>
<html lang="{{ app()->getLocale() }}">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Laravel</title>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css">
    </head>
    <body>
        <div class="container">
            <div class="row mt-4">
                <div class="col-md-6">
                    <h3>Ajouter un article</h3>
                    <hr>
                    {{-- part 1 --}}
                    <form action="{{route('post.add')}}" method="post">
                        {{csrf_field()}}
                        <div class="form-group">
                            <input type="text" placeholder="Titre" name="title" class="form-control">
                        </div>
                        <div class="form-group">
                            <textarea placeholder="Description" col="30" rows="5" name="body" class="form-control"></textarea>
                        </div>
                        <div class="form-group">
                            <button class="btn btn-primary" type="submit">Valider</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </body>
</html>
                            

2- إضافة route ف web.php

غادي نمشي ل web.php غادي نزيد route ديالي لي عطيتو create/ منبعد كنقول بلي غادي نستعمل ل fonction create لي كاينة ف PostsController وكنعطي ل route ل إسم لي هو post.add.

فالكود لي زدنا ف web.php هو :

                                //
<?php

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::get('/', function () {
    return view('welcome');
});

Route::get('/posts','PostsController@index');

Route::get('/edit/{id}/post','PostsController@edit');

Route::post('/create','PostsController@create')->name('post.add');

Route::get('/delete/{id}/post','PostsController@delete');
                            

3- كيفاش ندير form validation ف laravel

فباش ندير form validation غادي تفتح cmd فل projet ديالك ودير ل commande :

php artisan make:request CreateRequest

منبعد غادي تمشي ل dossier requests لي كاين ف app/Http غادي تلقى request تزادت غادي تفتح لملف فل :

- fonction authorize غادي تردها true يعني بغينا الحقول كاملين يكونوا عامرين.
- fonction rules كنزيد ل validation فعندي لحقل title كنعطيه required يعني ضروري وعلى الأقل خص يكون فيه 10 حروف نفس الشي بالنسبة ل body لي كنحدد يكون فيه 1000 حرف على الأكثر.

الكود لي زدنا ف CreateRequest.php هو :

                                //
<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class CreateRequest extends FormRequest
{
    // part 2
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array
     */
    public function rules()
    {
        return [
            //
            'title' => 'required|min:10',
            'body' => 'required|max:1000'
        ];
    }
}
                            

4- إضافة ل fonction create ل PostsController

فل controller PostsController كنزيد ل fonction create لي كتمكن من إضافة post فقاعدة البيانات فكنعطيها ل CreateRequest ف paramètre لي كنزيدها فأول الملف بهاد الطريقة :

use App\Http\Requests\CreateRequest

من بعد كن créer l'objet من la classe Post كيف شفنا قبل فبلاصت مكنعطي لمعلومات مباشرة كنخدم ب request لي كتمكني من استرجاع القيم لي كاينة فالحقول ديال الفورم.

منبعد كنزيد ل post وكنرجع المستخدم للصفحة الرئيسية لي غادي تعرض رسالة نجاح غادي نشوفوا كيفاش نعرضوها من بعد.

الكود لي زدنا ف PostsController هو : 

                                    //
<?php

namespace App\Http\Controllers;
use App\Post;
use Illuminate\Http\Request;
use App\Http\Requests\CreateRequest;

class PostsController extends Controller
{
    //
    public function index(){
        $posts = Post::all();
        foreach($posts as $post){
            echo $post->title;
        }
    }
    //part 5
    public function create(CreateRequest $request){
        $post = new Post();
        $post->title = $request->title;
        $post->body = $request->body;
        $post->save();
        return redirect('/')->with(['success'=>'article ajouté']);
    }
    public function delete($id){
        $post = Post::find($id);
        $post->delete();
        echo 'post supprimé';
    }
}
                                

5- عرض رساءل الخطأ والنجاح

فباش نعرض أخطاء ل validation فاش يكون مثلا شي حقل خاوي كنخدم ب :

- errors$ لي فيها fonction all لي كتمكن من استرجاع الأخطاء كاملين فهنا خدمنا ب foreach باش كنعرض كل خطا كيف كتشوف فالصورة :



منبعد باش ن afficher رسالة النجاح بعد الإضافة كنخدم ب Session لي كنسترجع بها لقيمة لي زدت ف success منبعد ما درت الإضافة ولي كتعرض كيف كتشوف فالصورة :




الكود لي زدنا ف welcome.blade.php هو : 


                                    //
<!doctype html>
<html lang="{{ app()->getLocale() }}">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Laravel</title>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css">
    </head>
    <body>
        <div class="container">
            <div class="row mt-4">
                <div class="col-md-6">
                    <h3>Ajouter un article</h3>
                    <hr>
                    {{-- part 4 --}}
                    @if(Session::has('success'))
                        <div class="alert alert-success">{{Session::get('success')}}</div>
                    @endif
                    {{-- part 3 --}}
                    @foreach($errors->all() as $error)
                        <div class="alert alert-danger">{{$error}}</div>
                    @endforeach
                    {{-- part 1 --}}
                    <form action="{{route('post.add')}}" method="post">
                        {{csrf_field()}}
                        <div class="form-group">
                            <input type="text" placeholder="Titre" name="title" class="form-control">
                        </div>
                        <div class="form-group">
                            <textarea placeholder="Description" col="30" rows="5" name="body" class="form-control"></textarea>
                        </div>
                        <div class="form-group">
                            <button class="btn btn-primary" type="submit">Valider</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </body>
</html>