[Thực hành] Custom Validation

Mục tiêu

 Luyện tập validate các trường dữ liệu trong form.

Mô tả 

Trong phần này chúng ta sẽ phát triển chức năng cho phép validate thông tin của người dùng.

Chức năng này cho phép nhập vào thông tin người dùng và hiển thị các thông báo tương ứng với giá trị của các trường dữ liệu.

Yêu cầu đối với dữ liệu người dùng bao gồm:

• Tên bắt buộc, có độ dài tối thiểu là 2 ký tự, tối đa là 30 ký tự
• Tuổi bắt buộc, có giá trị nhỏ nhất là 18

Hướng dẫn

Bước 1: Tạo mới project Laravel với tên Cusstom-Validation:

Mở Terminal và sử dụng câu lệnh bên dưới để tạo mới project:

composer create-project --prefer-dist laravel/laravel Custom-Validation

Tại terminal sử dụng câu lệnh: php artisan serve để khởi chạy project, mở trình duyệt gõ localhost:8000 để chạy project.

Bước 2: Tạo view:

Trong thư mục resources/views chỉnh sửa file welcome.blade.php, thêm form bao gồm 2 trường Name và Age.

<div class="content">
    <div class="title m-b-md">
        Laravel Cusstom Validation
    </div>
    <div class="form-custom-validation">
        <form action="" method="">
            <label for="name">Name: </label>
            <input id="name" name="name" type="text" placeholder="Enter the full name">
            <br>
            <label for="age">Age: </label>
            <input id="age" name="age" type="text" placeholder="Enter the age">
            <br>
            <button type="submit">Submit</button>
        </form>
    </div>
</div>

Bước 3: Tạo route:

Mở file web.php trong thư mục routes. Thêm route cho sự kiện submit form với phương thức GET.

Route::get('custom-validation', '[email protected]')->name('form.submit');

Tại view, cập nhật lại method và action của form

<form action="{{ route('form.submit') }}" method="GET">

Bước 4: Tạo FormController và phương thức checkValidation:

Trong terminal sử dụng câu lệnh để tạo FormController:

php artisan make:controller FormController

Trong thư mục app/Http/Controllers/ mở file FormController, tạo phương thức checkValidation() và thêm câu lệnh echo để in ra 2 trường name và age được gửi lên từ form.

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class FormController extends Controller
{
    public function checkValidation(Request $request)
    {
        echo 'Name:' . $request->name . '. Age: ' . $request->age;
    }
}

ại trình duyệt nhập dữ liệu vào 2 trường, nhấn submit để xem kết quả

Bước 5: Validation dữ liệu của form

Ở bước trên biến $request chứa dữ liệu được gửi lên từ form được khởi tạo từ đối tượng Illuminate\Http\Request mặc định của Laravel. Tại bước này, chúng ta sẽ tạo mới một đối tượng request riêng để xử lý việc xác thực dữ liệu.

Mở terminal sử dụng câu lệnh để tạo mới đối tượng FormRequest trong thư mục app\Http\Requests

php artisan make:request FormExampleRequest 

Mở file FormExampleRequest:

Tại phương thức authorize() thay đổi thành return true; để cho phép người dùng sử dụng đối tượng FormExampleRequest

Tại phương thức ruke() thêm các quy tắc xác thực dữ liệu được gửi lên từ form:

public function rules()
{
    return [
        'name' => 'required|min:2|max:30',
        'age' => 'required|numeric|min:18',
    ];
}

Trong đó:

• required là yêu cầu dữ liệu phải bắt buộc.
• min: là giá trị nhỏ nhất của dữ liệu, với dữ liệu là string thì sẽ là số lượng ký tự, với dữ liệu kiểu số thì min sẽ là giá trị nhỏ nhất.
• max: là giá trị lớn nhất của dữ liệu.
• numeric: yêu cầu dữ liệu phải là kiểu số.
• Ngoài ra còn nhiều các quy tắc khác trong Laravel, có thể tham khảo thêm tại: https://laravel.com/docs/5.7/validation#available-validation-rules

Sau khi định nghĩa bộ quy tắc xác thực dữ liệu xong, chúng ta sẽ tạo một phương thức message() để trả về view thông báo lỗi do chúng ta tự định nghĩa cho từng trường hợp.

public function message()
{
    $messages = [
        'name.required' => 'We need to know your full name!',
        'name.min' => 'Name size must be between 2 and 30!',
        'name.max' => 'Name size must be between 2 and 30!',
        'age.required' => 'We need to know your age!',
        'age.numeric' => 'Age under validation must be numeric',
        'age.min' => 'Age must be on 18!',
    ];

    return $messages;
}

Tại FormController sẽ thay đổi đối tượng xác thực request, khi dữ liệu được xác thực thành công sẽ quay trở lại view và hiển thị thông báo thành công.

public function checkValidation(FormExampleRequest $request) 
{
    $success = "Dữ liệu được xác thực thành công";
    return view('welcome', compact('success'));
}

Bước 6: Hiển thị kết quả:

Tại view, kiểm tra nếu có lỗi xảy ra trong việc xác thực dữ liệu thì hiển thị thông báo từng lõi cụ thể cho người dùng. Còn nếu việc xác thực dữ liệu thành công thì hiển thị thông báo thành công.

• Kiểm tra và hiển thị lỗi:

<div class="error-message">
    @if ($errors->any())
        @foreach($errors->all() as $nameError)
            <p style="color:red">{{ $nameError }}</p>
        @endforeach
    @endif
</div>

Tại view blade của Laravel thì mặc định những lỗi xác thực dữ liệu sẽ được lưu trong biến $errors. Chúng ta sẽ sử dụng  $errors->any() có sẵn để kiểm tra có lỗi hay không. Nếu kết quả là true thì sử dụng $errors->all() để lấy ra tất cả các lỗi. Vì là một mảng nên ta sử dụng foreach để in ra từng lỗi.

• Kiểm tra và in thông báo thành công:

<p style='color:green'>{{ (isset($success)) ? $success : '' }}</p>

Mở trình duyệt chạy ứng dụng, nhập thử các trường hợp với dữ liệu sau và xem kết quả

Mã nguồn tham khảo: https://github.com/codegym-vn/laravel-custom-validation.git